Photo by Hans M
- سحآبهۃ ♥
- المشاركات : 16
الانتساب : 31/01/2014
طلبَ كود سلايد شو ):
الجمعة فبراير 28, 2014 10:21 am
السلام عليكم ورحمة الله وبركإتة
ممكن هذا الكود ؟
- oussama_19
- المشاركات : 54
الانتساب : 21/04/2014
رد: طلبَ كود سلايد شو ):
الجمعة أكتوبر 17, 2014 11:27 am
تفضل يا عم
- الكود:
<style type="text/css">
.carousel {
border: medium none;
height: auto;
margin: 0 auto;
overflow: hidden;
position: relative;
width: 930px;
}
.carousel .slides {
border: medium none;
height: 200px;
list-style: none outside none;
margin: 0;
overflow: visible;
padding: 0;
position: relative;
}
.carousel .slides .slideItem {
border: medium none;
cursor: pointer;
margin: 0;
overflow: hidden;
padding: 0;
position: absolute;
}
.carousel .slides .slideItem a {
border: medium none;
display: block;
margin: 0;
outline: medium none;
padding: 0;
text-decoration: none;
}
.carousel .slides .slideItem img {
border: medium none;
height: 100%;
margin: 0;
padding: 0;
width: 100%;
}
.carousel .nextButton, .carousel .prevButton, .carousel .buttonNav .bullet, .carousel .buttonNav .bulletActive {
background-color: transparent;
background-image: url("http://i39.servimg.com/u/f39/12/22/94/86/icons10.png");
background-position: 0 0;
background-repeat: no-repeat;
}
.carousel .nextButton, .carousel .prevButton {
cursor: pointer;
height: 34px;
position: absolute;
top: 90px;
width: 34px;
z-index: 9999;
}
.carousel .nextButton {
background-position: 0 -34px;
left: 44px;
}
.carousel .nextButton:hover {
background-position: -34px -34px;
}
.carousel .nextButton:active {
background-position: -68px -34px;
}
.carousel .prevButton {
background-position: 0 0;
right: 44px;
}
.carousel .prevButton:hover {
background-position: -34px 0;
}
.carousel .prevButton:active {
background-position: -68px 0;
}
.carousel .buttonNav {
margin: 0 auto;
position: relative;
z-index: 999;
}
.carousel .buttonNav .numbers {
cursor: pointer;
float: left;
margin: 5px;
position: relative;
}
.carousel .buttonNav .numbers:hover {
}
.carousel .buttonNav .numberActive {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
color: #000;
cursor: default;
}
.carousel .buttonNav .bullet {
background-position: -16px -68px;
cursor: pointer;
float: right;
height: 16px;
margin: 5px;
position: relative;
width: 16px;
}
.carousel .buttonNav .bullet:hover {
background-position: 0 -68px;
}
.carousel .buttonNav .bulletActive {
background-position: 0 -68px;
cursor: default;
}
.carousel .shadow {
height: 26px;
width: 100%;
}
.carousel .shadow .shadowMiddle {
background: url("http://i39.servimg.com/u/f39/12/22/94/86/shadow11.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
height: 15px;
}
.carousel .shadow .shadowRight {
background: url("http://i39.servimg.com/u/f39/12/22/94/86/shadow10.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
height: 15px;
width: 69px;
}
.carousel {
border: medium none;
height: auto;
margin: 0 auto;
overflow: hidden;
position: relative;
width: 930px;
}
.carousel .slides {
border: medium none;
height: 200px;
list-style: none outside none;
margin: 0;
overflow: visible;
padding: 0;
position: relative;
}
.carousel .slides .slideItem {
border: medium none;
cursor: pointer;
margin: 0;
overflow: hidden;
padding: 0;
position: absolute;
}
.carousel .slides .slideItem a {
border: medium none;
display: block;
margin: 0;
outline: medium none;
padding: 0;
text-decoration: none;
}
.carousel .slides .slideItem img {
border: medium none;
height: 100%;
margin: 0;
padding: 0;
width: 100%;
}
.carousel .nextButton, .carousel .prevButton {
cursor: pointer;
height: 34px;
position: absolute;
top: 90px;
width: 34px;
z-index: 9999;
}
.carousel .nextButton {
background-position: 0 -34px;
left: 44px;
}
</style>
<script type="text/javascript" src="https://layalyeg1.googlecode.com/svn/trunk/سلايد شو دائري/layalyeg.js"></script>
<script type="text/javascript" src="https://layalyeg1.googlecode.com/svn/trunk/سلايد شو دائري/layalyeg1.js"></script>
<script type="text/javascript">
$(document).ready(function(){$('.carousel').carousel({carouselWidth:930,
carouselHeight:240, frontWidth: 220,hMargin: 0.7, vMargin: 0.2,frontHeight: 220, buttonNav:'bullets',
slidesPerScroll: 6, directionNav:true, shadow:true, autoplay: true, reflection:false });});</script>
<div id="atab"><div class="carousel"> <div class="slides">
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide110.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هناا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide210.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide310.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide410.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide510.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide610.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide710.png" title="أكتب عنوان الموضوع هنا" /></a></div>
<div><a href="ضع الرابط هنا"><img src="http://i39.servimg.com/u/f39/12/22/94/86/slide810.png" title="أكتب عنوان الموضوع هنا" /></a></div>
رد: طلبَ كود سلايد شو ):
الإثنين يوليو 06, 2015 5:01 am
يغلق و ينقل للارشيف
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى