PDA

View Full Version : عکس برگرده یا...



mohamad_torabi
شنبه 05 مرداد 1392, 00:13 صبح
سلام
به این سایت نگاه کنیدwww.graphist.net/#home1
زمانی که موس روی اون چهار خونه سمت راست قرار میگیره عکی برمیگرده اگه بخوام اینو داشته باشم باید از چه پلاگینی تو جی کوئری استفاده کنم

H:Shojaei
شنبه 05 مرداد 1392, 00:28 صبح
سلام
فكر كنم اين بدردتون بخوره:


<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:100px;
height:75px;
background-color:red;
border:1px solid black;
transition: 2s;
-webkit-transition: 2s; /* Safari */
}
div:hover
{

transform:rotateY(180deg);
-webkit-transform:rotateY(180deg); /* Safari and Chrome */

}
</style>
</head>
<body>

<p><b>Note:</b> Internet Explorer 9 (and earlier versions) and Opera does not support the rotateX method.</p>

<div id="div1">Hello. This is a DIV element.</div>


</body>
</html>

mohamad_torabi
شنبه 05 مرداد 1392, 00:39 صبح
سلام
فكر كنم اين بدردتون بخوره:


<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:100px;
height:75px;
background-color:red;
border:1px solid black;
transition: 2s;
-webkit-transition: 2s; /* Safari */
}
div:hover
{

transform:rotateY(180deg);
-webkit-transform:rotateY(180deg); /* Safari and Chrome */

}
</style>
</head>
<body>

<p><b>Note:</b> Internet Explorer 9 (and earlier versions) and Opera does not support the rotateX method.</p>

<div id="div1">Hello. This is a DIV element.</div>


</body>
</html>

دوست عزیز ممنون تو مربع های خالی و نوشته دار درسته ولی مربع های بکگراند عکس دار نه اگه میشه یه مثال دیگه با بگ گراند بزنید

H:Shojaei
شنبه 05 مرداد 1392, 01:01 صبح
عكس دار هم امتحان كردم درست بود:

<!DOCTYPE html>
<html>
<head>
<style>
#div0
{
width:100px;
z-index:1;
height:75px;
border:1px solid black;
transition: 2s;
-webkit-transition: 2s; /* Safari */
background-image:url(5.jpg);
}
#div0:hover
{
color:#aaaaaa;
background-image:none;
background-color:red;
transform:rotateY(180deg);
-webkit-transform:rotateY(180deg); /* Safari and Chrome */

}

</style>
</head>
<body>

<p><b>Note:</b> Internet Explorer 9 (and earlier versions) and Opera does not support the rotateX method.</p>

<div id="div0">Hello. This is a DIV element.</div>


</body>
</html>

mohamad_torabi
شنبه 05 مرداد 1392, 01:07 صبح
برا من یه صفحه نارنجی میفته روش نمیچرخه

2undercover
شنبه 05 مرداد 1392, 07:13 صبح
این آموزشش هست: Create a flipping animation (http://davidwalsh.name/css-flip)

na_des
شنبه 05 مرداد 1392, 10:19 صبح
سلام
یه سایت خوب قبلا دوستان معرفی کردن که خیلی از امکانات css3 معرفی کرده :(به من که خیلی کمک میکنه )
اینجا (http://css3.host22.com/p.html)