PDA

View Full Version : حرکت عکس 1 وقتی موس روی عکس 2 میرود



md3848
یک شنبه 18 اسفند 1392, 11:02 صبح
کد زیر برا وقتیه که وقتی موس روی عکس 1 رفت عکس یه حرکتی بکنه
.img1:hover { left: 35px; }

حالا من میخوام وقتی موس روی عکس 1 رفت عکس 2 حرکت بکند

کدش چه جوریه؟؟

دانیال دزفولی
یک شنبه 18 اسفند 1392, 12:32 عصر
.img1:hover~.img2 { left: 35px; }

دانیال دزفولی
یک شنبه 18 اسفند 1392, 12:32 عصر
البته باید عکس دو کنارش باشه

md3848
یک شنبه 18 اسفند 1392, 12:49 عصر
عمل نکرد
کدم به صورت زیر هست---مشکلش چیه



<!--////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////--><html><head><style type="text/css">


.img1 { height:42px; width:42px; left: 0px; top: 150px; position: fixed;
border: 1px solid; border-radius: 4px; }
.button1 { height:30px; width:130px; position: fixed; left: -90px; top: 150px; background-color: pink; text-align: center; padding-top: 12px;
-moz-transition:all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; -o-transition:all 0.3s ease-in; -ms-transition:all 0.3s ease-in;
border: 1px solid; border-radius: 4px; }
.img1 : hover ~ .button1 { left: 38px; }


</style></head><body>

<a href="http://www.kelidestan.com/index.php"><div class="button1">کلیدستان</div></a>
<div class="img1"><img src="ico\small\home.png"></div>

</body>
</html>

دانیال دزفولی
یک شنبه 18 اسفند 1392, 13:19 عصر
دقیقا میخوای چی بشه؟

دانیال دزفولی
یک شنبه 18 اسفند 1392, 13:23 عصر
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
.one {
position: relative;
width: 100px;
height: 100px;
background: #555;
float: left;
z-index: 2
}
.two {
position: relative;
width: 100px;
height: 100px;
background: #0000ff;
float: left;
left: -100px;
z-index: 1;
transition: .2s left
}
.one:hover~.two {
left: 0;
}
</style>
</head>


<body>
<div class="one"></div>
<div class="two"></div>
</body>
</html>

2undercover
یک شنبه 18 اسفند 1392, 16:21 عصر
http://codepen.io/2undercover/full/KatEr