keyvan 200

درخواست جی کوئری اسلایدر لوگو

8 پست در این موضوع قرار دارد

سلام خدمت دوستان

من به یه جی کوئری اسلایدر لوگوها نیاز دارم که اتو اسکرول هم باشه

دقیقا مثل اینی که داخل این سایت استفاده شده

http://www.nikpakhsh.com

تشکر

0

به اشتراک گذاری این پست


لینک به پست

سلام

داداش یه فایل برات پیوست کردم. این یه اسلایدر ساده هست. که هم دکمه داره و هم اتوماتیک اسکرول می کنه. منتها تو هر اسلاید یه عکس داره. با یه کمی تغییر تو اندازه هاش می تونی اون چیزی که می خوای ازش در بیاری.

slideshow.zip

5

به اشتراک گذاری این پست


لینک به پست

سلام

داداش یه فایل برات پیوست کردم. این یه اسلایدر ساده هست. که هم دکمه داره و هم اتوماتیک اسکرول می کنه. منتها تو هر اسلاید یه عکس داره. با یه کمی تغییر تو اندازه هاش می تونی اون چیزی که می خوای ازش در بیاری.

سلام

از کدتون اسفاده کردم ، ولی : منتها تو هر اسلاید یه عکس داره...

الان من این رو ساختنم منتهی ریخت بهم :

slideshow.zip

ویرایش شده در توسط honda.moji
0

به اشتراک گذاری این پست


لینک به پست

شما کافیه داخل li هر چی دوست دارید بزارید. چه عکس باشه، چه متن و چه ترکیبی از هر دو.

2

به اشتراک گذاری این پست


لینک به پست

شما کافیه داخل li هر چی دوست دارید بزارید. چه عکس باشه، چه متن و چه ترکیبی از هر دو.

من فقط طول و عرض اسلایدر رو عوض کردم + تعویض باتوم ها ! الان ریخته بهم میشه یه نگاه به فایل زیپ بندازید ؟

اینم استایل :


*{
margin:0;
padding: 0;
background:#372b2a;
}
#container{
position: relative;
margin:auto;
background:url(../../../../xampp/htdocs/wordpress/wp-content/themes/blog/images/bg.jpg);
width:auto;
height:auto;
border-bottom: 1.5px dashed #CCC;
border-top: 1.5px dashed #CCC;
box-shadow:0 4px 6px 2px #2d2322;

}
#slideshow{
position: relative;
margin: auto;
width: 800px;
height: 200px;
padding-top:0px;
}
#slideshow #images{
position: relative;
overflow-x: scroll;
overflow-y: hidden;
}
#images ul{
width: 3000px;
list-style: none;
}
#images li{
float: left;
}
#slideshow a{
position: absolute;
z-index: 10;
width: 30px;
height: 200px;
float: left;
display: none;
}
#slideshow .left{
background-image: url('images/nav-left.png');
margin-left:0px;
}
#slideshow .right{
background-image: url('images/nav-right.png');
right: 0px;
}

0

به اشتراک گذاری این پست


لینک به پست

از داخل script.js یه 750 داره. طول عکس رو اینجا باید وارد کنید.

3

به اشتراک گذاری این پست


لینک به پست

از داخل script.js یه 750 داره. طول عکس رو اینجا باید وارد کنید.


$(function(){
var i = 0;

$('#images').css('overflow-x' , 'hidden');
$('#images').scrollLeft(0);
$('#slideshow a').css('display' , 'block');
$('#slideshow a').css('opacity' , '0.0');

window.setInterval(function(){
if(i>=3)
i = -1;
i++;
$('#images').animate({scrollLeft: i*750},500);
}, 5000);

$('#slideshow').mouseenter(function(){
$('#slideshow a').animate({opacity: 1.0}, 300);
});

$('#slideshow').mouseleave(function(){
$('#slideshow a').animate({opacity: 0.0}, 300);
});

$('#slideshow .right').click(function(){
window.clearInterval();
if(i>=3)
i = -1;
i++;
$('#images').animate({scrollLeft: i*750},500);
});

$('#slideshow .left').click(function(){
window.clearInterval();
if(i <= 0)
i = 4;
i--;
$('#images').animate({scrollLeft: i*750},500);
});

});

0

به اشتراک گذاری این پست


لینک به پست

سلام 

من دنبال اسلایدر سایت https://marvel.com قسمت NEW COMICS میگردم 

اسلایدرش می خواستم لطفا کمک کنید

 

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری