gol
gol

hardy

گر می نخوری طعنه مزن مستان را

بنیاد مکن تو حیله و دستان را

تو غره بدان مشو که می می نخوری

صد لقمه خوری که می غلامست آنرا
«خیام»

×

توجه : دو ارسال نخستِ کاربرانِ جدید در تالار میدوری , پیش از نمایش , نیاز به تایید مدیریت دارند.

Latest Threads  آخرین ارسال ها :
نمایش آخرین ارسال این موضوع
 
امتیاز موضوع:
  • 5 رأی - میانگین امیتازات : 2.8
  • 1
  • 2
  • 3
  • 4
  • 5
 
  
1 کاربر حاضر در تاپیک: (0 عضو, و 1 مهمان). 1 مهمان
نویسنده:میدوری
آخرین ارسال:میدوری
پاسخ: 3
بازدید: 4478
subscription
quickreply advancequickreply report



( ابزار سایت ) پشت و رو کردن تصویر با CSS
  نویسنده پیام  | تغییر اندازه ی متن:  zoomin zoomout default
admin میدوری profile  
آنلاین
مدیر کل تالار
مدالهای میدوری1000500
1001011720
168241051
دسترسی به میدوری
ارسال یک ایمیل به این کاربر ارسال یک پیام خصوصی به این کاربر مشاهده وب سایت کاربر یافتن تمامی ارسال های این کاربر اعتبار:
اطلاعات میدوری


تاریخ عضویت: 05 November 2011

ارسال ها: 1,742
شماره کاربری: 1
میزان اعتبار:

محل سکونت: تهران
ماه تولد:
جنسيت:
آخرین دیدار:
تماس با میدوری
حالت میدوری
صفحه های میدوری
گوگل پلاس فیس بوک توییتر یوتیوب کلوب
اینستاگرام تلگرام
ارسال: #1
Eye Blink پشت و رو کردن تصویر با CSS

rightarrow
پشت و رو کردن تصویر با CSS
برای ایجاد چرخش و یا حالت پشت و رو کردن تصویر پروژه ای برای دوستان قرار میدهم مورد مصرف و تغییرات بعهده ی خودتان است (طبق معمول). در پايان کدهای استفاده شده را برای بررسی و استفاده هم قرار داده ام .

کد HTML:
<style type="text/css">
#container {position: relative; height:362px; width: 282px; margin: 0 auto;}
#container div {position:absolute; left:0; top:0; width:242px; height: 322px; padding:20px; background:#463;
-ms-border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-transition: 1.5s ease-in-out;
-moz-transition: 1.5s ease-in-out;
-ms-transition: 1.5s ease-in-out;
-o-transition: 1.5s ease-in-out;
transition: 1.5s ease-in-out;
}
#container div.lower {font-family: verdana, arial, sans-serif; background:#642;
background: -moz-linear-gradient(-45deg, #642, #864 50%, #642 100%);  
background: -webkit-gradient(linear, 0 0, 100% 100%, from(#642), color-stop(50%, #a86), color-stop(100%, #642));
background: linear-gradient(-45deg, #642, #864 50%, #642 100%);  
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transform: perspective(800px) rotateY(180deg);
-webkit-transform: perspective(800px) rotateY(180deg);
transform: perspective(800px) rotateY(180deg);
}
#container div.lower h1 {font-size:20px; padding:0; margin:0; color:#fff; line-height:40px;}
#container div.lower p {font-size:11px; padding:0; margin:0; color:#eee; line-height:20px;}
#container div.lower a {color:#ff0;}
#container div.upper {
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transform: perspective(800px) rotateY(0deg);
-webkit-transform: perspective(800px) rotateY(0deg);
transform: perspective(800px) rotateY(0deg);
background: -moz-linear-gradient(-45deg, #463, #8a7 50%, #463 100%);
background: -webkit-gradient(linear, 0 0, 100% 100%, from(#463), color-stop(50%, #8a7), color-stop(100%, #463)); 
background: linear-gradient(-45deg, #463, #8a7 50%, #463 100%);
}
#container div.upper img {border:1px solid #fff;}
#container:hover div.lower {
-moz-transform: perspective(800px) rotateY(0);
-webkit-transform: perspective(800px) rotateY(0);
transform: perspective(800px) rotateY(0);
}
#container:hover div.upper {
-webkit-transform: perspective(800px) rotateY(-179.9deg);
-moz-transform: perspective(800px) rotateY(-179.9deg);
transform: perspective(800px) rotateY(-179.9deg);
}
</style>
<br><br>
<div id="container" aria-haspopup="true">
    <div class ="lower">
	   <h1>The Barn Owl</h1>
	   <p>(Tyto alba) is the most widely distributed species of owl, and one 
of the most widespread of all birds. It is also referred to as Common 
Barn Owl, to distinguish it from other species in the barn-owl family 
Tytonidae. These form one of two main lineages of living owls, the other
 being the typical owls (Strigidae). T. alba is found almost anywhere in
 the world except polar and desert regions, Asia north of the Alpide 
belt, most of Indonesia, and the Pacific islands.</p>
	   <p>Source <a href="#">Midori</a>
    </p></div>
    <div class ="upper">
	   <img src="owl.jpg" alt="Barn owl">
    </div>
</div>
<br><br>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68





امضای میدوری :
[تصویر: mvd09b5.gif]
[تصویر: midori-sign-400.png]
( آخرین ویرایش در این ارسال: 29 - August - 2014 08 : 10 AM، توسط : میدوری .::. دلیل ویرایش: )
محل حضور کاربر در تالار :  admin میدوری در حال مشاهده جعبه پیام است .     زمان حضور :  15 : 01 AM
ديدگاه کاربران برای مطلب : help (روی آیکون مورد نظر کلیک کنید تا دیدگاه شما ثبت شود . در صورت انصراف تا دوبار می توانید دیدگاه خود را ثبت کنید . برای پاک کردن دیدگاه روی همان آیکون یک بار کلیک کنید تا دیدگاه شما پاک شود .)

 1 کاربر  (لیست)
 1 کاربر
برچسب ها :

29 - August - 2014 07 : 10 AM
اعتبار: اهدای موجودی بــانــکــ نقل قول این ارسال در یک پاسخ
member mohamadn profile  
آفلاین
کاربر تالار
مدالهای mohamadn1051
دسترسی به mohamadn
ارسال یک ایمیل به این کاربر ارسال یک پیام خصوصی به این کاربر مشاهده وب سایت کاربر یافتن تمامی ارسال های این کاربر اعتبار:
اطلاعات mohamadn


تاریخ عضویت: 13 October 2014

ارسال ها: 4
شماره کاربری: 1256
میزان اعتبار:

جنسيت:
آخرین دیدار:
تماس با mohamadn
حالت mohamadn
صفحه های mohamadn
گوگل پلاس فیس بوک توییتر یوتیوب کلوب
ارسال: #2
RE: پشت و رو کردن تصویر با CSS

rightarrow
جهت پشت رو شدن را میخوام تغیر بدم
میخواهم از پایین به بالا باشه
باید کجا را تغییر بدم




محل حضور کاربر در تالار :  member mohamadn در تالار ميدوری حضور ندارد .
ديدگاه کاربران برای مطلب : help (روی آیکون مورد نظر کلیک کنید تا دیدگاه شما ثبت شود . در صورت انصراف تا دوبار می توانید دیدگاه خود را ثبت کنید . برای پاک کردن دیدگاه روی همان آیکون یک بار کلیک کنید تا دیدگاه شما پاک شود .)

13 - October - 2014 22 : 01 PM
اعتبار: اهدای موجودی بــانــکــ نقل قول این ارسال در یک پاسخ
admin میدوری profile  
آنلاین
مدیر کل تالار
مدالهای میدوری1000500
1001011720
168241051
دسترسی به میدوری
ارسال یک ایمیل به این کاربر ارسال یک پیام خصوصی به این کاربر مشاهده وب سایت کاربر یافتن تمامی ارسال های این کاربر اعتبار:
اطلاعات میدوری


تاریخ عضویت: 05 November 2011

ارسال ها: 1,742
شماره کاربری: 1
میزان اعتبار:

محل سکونت: تهران
ماه تولد:
جنسيت:
آخرین دیدار:
تماس با میدوری
حالت میدوری
صفحه های میدوری
گوگل پلاس فیس بوک توییتر یوتیوب کلوب
اینستاگرام تلگرام
ارسال: #3
RE: پشت و رو کردن تصویر با CSS

rightarrow
(13 - October - 2014 22 : 01 PM)mohamadn نوشته بوده :  جهت پشت رو شدن را میخوام تغیر بدم
میخواهم از پایین به بالا باشه
باید کجا را تغییر بدم
درود بر شما
باید تغییرات داده بشه که فعلا وقت کافی برای این کار نیست تا بعد شاید انجام شود . Cool




امضای میدوری :
[تصویر: mvd09b5.gif]
[تصویر: midori-sign-400.png]
محل حضور کاربر در تالار :  admin میدوری در حال مشاهده جعبه پیام است .     زمان حضور :  15 : 01 AM
ديدگاه کاربران برای مطلب : help (روی آیکون مورد نظر کلیک کنید تا دیدگاه شما ثبت شود . در صورت انصراف تا دوبار می توانید دیدگاه خود را ثبت کنید . برای پاک کردن دیدگاه روی همان آیکون یک بار کلیک کنید تا دیدگاه شما پاک شود .)

13 - October - 2014 52 : 01 PM
اعتبار: اهدای موجودی بــانــکــ نقل قول این ارسال در یک پاسخ


subscription
quickreply advancequickreply report

موضوع های مرتبط با این موضوع...
موضوع: نویسنده پاسخ: بازدید: آخرین ارسال
Clocket abzar ايجاد نوشته یا تصویر رمزگونه در سایت ها با Css میدوری 0 4,759 15 - March - 2015 21 : 12 PM
آخرین ارسال: میدوری
Eye Blink abzar متن و تصویر در کنار هم با ابتکاری بی نظیر با CSS3 میدوری 0 1,440 13 - September - 2014 53 : 01 AM
آخرین ارسال: میدوری
minioni abzar قاب بیضی برای تصویر با CSS میدوری 0 1,024 12 - September - 2014 47 : 12 PM
آخرین ارسال: میدوری
Snowman abzar تنظیم خودکار اندازه ی تصویر پس زمینه با متن با CSS میدوری 1 5,197 03 - September - 2014 10 : 02 AM
آخرین ارسال: Pishro
Flower abzar نمایش تصویر بصورت سه بعدی با استفاده از کدهای CSS3 میدوری 3 10,450 26 - July - 2014 26 : 11 AM
آخرین ارسال: SASHA

بازديدکنندگان از موضوع
کاربرانی که از موضوع بازدید کرده اند ( 13 ) کاربر

ابزار موضوع



1 کاربر حاضر در تاپیک: (0 عضو, و 1 مهمان). 1 مهمان