PDA

View Full Version : مشکل در ساخت اسلایدر



jaboli
چهارشنبه 22 آبان 1392, 22:24 عصر
سلام.من میخوام یه قسمت نمونه کار تو سایتم اضافه کنم که هر چند ثانیه دوتا نمونه کار قبلی از کادر خارج بشه و دوتا نمونه کار دیگه وارد کادر بشه
ببینید مشکل این دستورات چیه؟!

فایل Html
<div class="portfolio">
<ul>
<li>
<div class="portfolio-web-img"><img src="" alt="" width="100%" height="190px"/></div>
<div class="portfolio-web-desc"><br /><b>نام سایت : </b><br/><br/><b>نوع طراحی : </b><br /><br/><b> طراحان : </b><br /><br/><b>آدرس سایت :</b></div>
</li>
<!--end portfolio 1 -->
<li>
<div class="portfolio-web-img"><img src="" alt="" width="100%" height="190px"/></div>
<div class="portfolio-web-desc"><br /><b>نام سایت : </b><br/><br/><b>نوع طراحی : </b><br /><br/><b> طراحان : </b><br /><br/><b>آدرس سایت :</b></div>
</li>
<!--end portfolio 2 -->
<li>
<div class="portfolio-web-img"><img src="" alt="" width="100%" height="190px"/></div>
<div class="portfolio-web-desc"><br /><b>نام سایت : </b><br/><br/><b>نوع طراحی : </b><br /><br/><b> طراحان : </b><br /><br/><b>آدرس سایت :</b></div>
</li>
<!--end portfolio 3 -->
</ul>
</div>

فایل Css
.portfolio{
width:100%;
height:250px;
border:1px solid #BEBEBE;
-moz-border-radius:5px;
-ms-border-radius:5px;
-o-border-radius:5px;
-webkit-border-radius:5px;
background-color:white;
margin:10px auto;
overflow:hidden;
position:relative;
}
.portfolio ul{
width:95%;
height:100%;
overflow:hidden;
position:relative;
margin:0;
padding:0;
}
.portfolio ul>li{
left:200px;
list-style-type:none;
border:1px solid #999;
width:45%;
height:200px;
margin-top:15px;
margin-right:35px;
float:right;
}
.portfolio-web-img{
width:40%;
height:190px;
margin:5px;
border:1px dashed #999;
float:right;
}
.portfolio-web-desc{
width:50%;
height:190px;
margin:5px;
border:1px dashed #999;
float:left;
text-align:right;
direction:rtl;
text-decoration:none;
}
.portfolio-web-desc b{
margin:10px;
}

فایل جی کوئری
function portfolio(){
$('.portfolio ul li:first').appendTo('.portfolio ul');
}
setInterval(function(){
portfolio();
},4000);

farshadz
چهارشنبه 22 آبان 1392, 23:49 عصر
سلام به جای این همه زحمت کد نویسی انواع اقسام این اسلایدرشوها به صورت جاواسکریپت و جی کوئری وجود داره و تنها کافیه عکسها رو عوض کنید دیگه این همه زحمت کدنویسی رو نکشید

jalil_gh
پنج شنبه 23 آبان 1392, 10:19 صبح
ای بابا این که کار می‌کنه. فقط چون تغییرات در لحظه اتفاق می‌افته و همه اون شکل‌ها مثل هم هستن تغییرات مشاهده نمیشه.