طلب كود اعلانات التمرير

اذهب الى الأسفل

طلب كود اعلانات التمرير

مُساهمة من طرف DIYAR في الخميس 24 مايو 2012 - 16:02

هناك كود عجزت ان اصل اليه فلعله لدى احك من حضراتكم
كود علانات يعرض عدة بنرات في وقت زمني معين ويتحرك تلقائيا
ارجو افادتي ... Cool
avatar
DIYAR
 
 

ذكر
عدد المساهمات : 577
معدل النشاط : 2807
السُمعة : 4

http://z-ns.blogspot.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طلب كود اعلانات التمرير

مُساهمة من طرف YasirAyad في الخميس 24 مايو 2012 - 16:08

تفضل الكود الاتي,,,

الكود:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">$(document).ready(function(){
var imgHeight = 61;
var imgWidth = 539;
var imagesCount = $("#slider img").length;
var autoSlideShowTime = 5000;
var correntImg = 0;
var t=setTimeout("$('#sliderNextImg').trigger('click');",autoSlideShowTime);
function showDescription() {
$("#desContent").html($("#slider ul li").slice(correntImg, correntImg+1).html());
var descriptionHeight = $("#description").height();
$('#description').animate({opacity: 0.0, height: '0px'}, 1);
$('#description').delay(1000).animate({opacity: 0.5, height: '60px'}, 500);}
showDescription();
$("#slider").hover(function() {
$("#sliderNextImg, #sliderPreviousImg").css("visibility","visible");
}, function() {
$("#sliderNextImg, #sliderPreviousImg").css("visibility","hidden");})
$("#sliderNextImg").click(function() {
clearTimeout(t)
if (correntImg != imagesCount-1) {
correntImg += 1;
$('#scroll').animate({marginTop: (-(correntImg) * imgHeight) + "px"}, 1000);
t=setTimeout("$('#sliderNextImg').trigger('click');",autoSlideShowTime);} else {
correntImg = 0;
$('#scroll').animate({marginTop: "0px"}, 2000);
t=setTimeout("$('#sliderNextImg').trigger('click');",1000+autoSlideShowTime);}
showDescription()});
$("#sliderPreviousImg").click(function() {
clearTimeout(t)
if (correntImg != 0) {
correntImg -= 1;
$('#scroll').animate({marginTop: (-(correntImg) * imgHeight) + "px"}, 1000);} else {
correntImg = imagesCount - 1;
$('#scroll').animate({marginTop: (-(correntImg) * imgHeight) + "px"}, 2000);}
t=setTimeout("$('#sliderNextImg').trigger('click');",autoSlideShowTime);
showDescription()});});</script>

<style type="text/css">
#slider {
 position:relative;
 margin: 0 auto;
 height:61px;
 width:539px;
 border:0px #8D8C8D solid;
 background-color:;
 -moz-border-radius: 0px;
 -khtml-border-radius: 0px;
 -webkit-border-radius: 0px;
}
 
#ImgsWrapper {
 position:relative;
 height:61px;
 width:539px;
 margin:0 0px;
 top:0px;
 overflow:hidden;
}
 
#description {
 position:absolute;
 background-color:transparent;
 width:100%;
 bottom:0;
 color:white;
 text-align:right;
 font-size:1em;
 font-weight:bold;
 filter:alpha(opacity=50);
 -moz-opacity:0.5;
 -khtml-opacity: 0.5;
 opacity: 0.5;
}
 
#description #desContent {
 margin:10px;
}
 
#slider a {
 display:block;
 height:61px;
 width:539px;
}
 
#slider img {
 border:0;
}
 
#slider #sliderNextImg, #slider #sliderPreviousImg {
 filter:alpha(opacity=30);
 -moz-opacity:0.3;
 -khtml-opacity: 0.3;
 opacity: 0.3;
}
 
#slider #sliderNextImg, #slider #sliderPreviousImg {
 position:absolute;
 background-color:white;
 text-align:center;
 height:24px;
 width:50px;
 top:50%;
 margin-top:-12px;
 font-family:Arial, Helvetica, sans-serif;
 font-size:1em;
 font-weight:bold;
 color:black;
 cursor:pointer;
 padding-top:5px;
 visibility:hidden;
 z-index:9999;
 -moz-border-radius: 5px;
 -khtml-border-radius: 5px;
 -webkit-border-radius: 5px;
}
 
#slider #sliderNextImg {
 left:5px;
}
 
#slider #sliderPreviousImg {
 right:5px;
}
 
#slider #sliderNextImg:hover, #slider #sliderPreviousImg:hover {
 filter:alpha(opacity=80);
 -moz-opacity:0.8;
 -khtml-opacity: 0.8;
 opacity: 0.8;
}
 
#slider ul {
 display:none;
}
</style>
 
</head>
<body>

<div id="slider">

<div id="sliderNextImg">التالي</div>
<div id="sliderPreviousImg">السابق</div>
 
<div id="ImgsWrapper">
<div id="description"><div id="desContent"></div></div>
<div id="scroll">

 <!-- الكود الخاص بالبنرات -->
<img src="http://i49.servimg.com/u/f49/17/49/19/61/112.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/212.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/311.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/410.png" />
 <!-- الكود الخاص بالبنرات -->

</div></div></div>
[/spoiler]

ابحث على
<!-- الكود الخاص بالبنرات -->
<img src="http://i49.servimg.com/u/f49/17/49/19/61/112.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/212.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/311.png" />
<img src="http://i49.servimg.com/u/f49/17/49/19/61/410.png" />
<!-- الكود الخاص بالبنرات -->


لتغير البنرات,,
avatar
YasirAyad
 
 

ذكر
عدد المساهمات : 11127
معدل النشاط : 13023
السُمعة : 296

http://yasirayad.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: طلب كود اعلانات التمرير

مُساهمة من طرف DIYAR في الخميس 24 مايو 2012 - 16:11

اشكرك واعلم كيف اعدل عليه لاكن اخوي هل هناك
مساحته اعرض وتتجه الى اليسار؟!
avatar
DIYAR
 
 

ذكر
عدد المساهمات : 577
معدل النشاط : 2807
السُمعة : 4

http://z-ns.blogspot.com/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى