hossin.esm
چهارشنبه 08 آبان 1392, 17:50 عصر
سلام
یکم تغییر دادم
رو زمان باید بیشتر کار بشه.
<style>
#pic1 {
width:100px;
height:100px;
position:absolute;
left:100px;
}
#pic2{
width:100px;
height:100px;
position:absolute;
left:200px;
}
#pic3{
width:100px;
height:100px;
position:absolute;
left:300px;
}
#pic4{
width:100px;
height:100px;
position:absolute;
left:400px;
}
#pic5{
width:100px;
height:100px;
position:absolute;
left:500px;
}
#pic6{
width:100px;
height:100px;
}
</style>
<div style="width:1000px; background:pink; height:200px;">
<div id="pics">
<div id="pic1"><img src="http://generalsite.ir/s1.jpg" width="100" height="100"/></div>
<div id="pic2" ><img src="http://generalsite.ir/s2.jpg" width="100" height="100" /></div>
<div id="pic3" ><img src="http://generalsite.ir/s3.jpg" width="100" height="100" /></div>
<div id="pic4" ><img src="http://generalsite.ir/s4.jpg" width="100" height="100" /></div>
<div id="pic5" ><img src="http://generalsite.ir/s5.jpg" width="100" height="100" /></div>
<div id="pic6" ><img src="http://generalsite.ir/s6.jpg" width="100" height="100" /></div>
</div>
</div>
<script src="jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function () {
$('#pic2').hide();
$('#pic4').hide();
$('#pic6').hide();
$("#pic1").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
$("#pic3").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
$("#pic5").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
});
myfunction();
setInterval("myfunction()", 3000);
function myfunction() {
//$('#pic1').hide();
//$('#pic2').show();
$("#pic2").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
// $('#pic3').hide();
// $('#pic4').show();
$("#pic4").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
// $('#pic5').hide();
// $('#pic6').show();
$("#pic6").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
}
myfunction2();
setInterval("myfunction2()", 3000);
function myfunction2() {
//$('#pic1').show();
$("#pic1").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
// $('#pic2').hide();
// $('#pic3').show();
$("#pic3").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
// $('#pic4').hide();
// $('#pic5').show();
$("#pic5").toggle({
opacity: '0.5',
height: '150px',
width: '150px'
});
// $('#pic6').hide();
}
</script>