ابحث عن كود لتبديل الصور تلقائيا كل 10ثوان

**باسل** · 08-08-2006

السلام عليكم
ابحث عن كود لتبديل الصور تلقائيا كل 10ثوان حيث اضع عشر صور مثلا وتتبدل تلقائيا في مكان واحد من الصفحة كل عشر ثوان
لقد حاولت في جافا سكريبت ولكن للأسف خبرتي قليلة فيها
وجزاكم الله كل خير سلفا

**محمود حسين** · 08-08-2006

المشاركة الأصلية كتبت بواسطة باسل

السلام عليكم
ابحث عن كود لتبديل الصور تلقائيا كل 10ثوان حيث اضع عشر صور مثلا وتتبدل تلقائيا في مكان واحد من الصفحة كل عشر ثوان
لقد حاولت في جافا سكريبت ولكن للأسف خبرتي قليلة فيها
وجزاكم الله كل خير سلفا

السلام عليكم ورحمة الله وبركاته

إليك هذه المقالة عن استخدام Timers في الجافاسكريبت
اقرأها بتساعدك تصل للمطلوب
http://code.dreamincode.net/snippet174.htm

تحياتي

**باسل** · 09-08-2006

جزاك الله الخير اخي الكريم
ولكن حاولت ولاتزال هناك مشكلة

ياترى هل هناك كود جاهز لهذه الفكرة
مع تحياتي

**متصفح سعودي** · 09-08-2006

http://www.losha.net/vb/index.php

**شبكة الملكة** · 10-08-2006

هذا ما الاحظه في المواقع الصينية ..

وان شاء الله اقدر اجيب لك الكود

وهذا كود المنتدى الذي وضعه الأخ نصوص

كود PHP:


<!-- بداية إعلان جافا متميز --> <div align="center"> <table width="470" height="90" dir="ltr"><tr><td> <script>

var slideurl=new Array()

var slidecomment=new Array()

var slidelink=new Array()

var slidetarget=new Array()

///////////////////////////////////////////////////////////////////////////

// EDIT-ZONE STARTS HERE  // BY : WWW.STAR28.COM

//////////////////////////////////////////////////////////////////////////

// Set the URLs of your slides (images) // مسار الصور

slideurl[0]="http://www.ojqji.net/up_vb/uploads/5893000d31.gif"

slideurl[1]="http://www.losha.net/mypictures/losha2.gif"

slideurl[2]="http://www.ojqji.net/web/images/link_to_us/oJqJI_12.gif"

slideurl[3]="http://www.awlstyle.com/vb/images/awl-in/forum/bnrbig11.gif"

slideurl[4]="http://www.agmale7sas.com/agmale7sas.gif"

slideurl[5]="http://www.alm3refh.com/alm3refh1.gif"

// Add a link for each slide // 

// If you don't want to link a slide type "#" instead (see middle-sample below)

// روابط البنرات على الترتيب

slidelink[0]="http://www.losha.net/vb/showthread.php?t=1840"

slidelink[1]="http://www.losha.net/tell/ip_example.php"

slidelink[2]="http://www.ojqji.net/vb"

slidelink[3]="http://www.awlstyle.com/vb/index.php"

slidelink[4]="http://www.agmale7sas.com/vb"

slidelink[5]="http://www.alm3refh.com"

// Add a target for each link

// Allowed values are: "_blank", "_top", "_parent", "_self" or the name of a frame

slidetarget[0]="_blank"

slidetarget[1]="_blank"

slidetarget[2]="_blank"

slidetarget[3]="_blank"

slidetarget[4]="_blank"

slidetarget[5]="_blank"

// Add a comment for each slide // الوصف

slidecomment[0]="::.. بـأي ذنب قُـتلـت ..::"

slidecomment[1]="فرصه إعلانيه مدفوعه سارع بالطلب سعر مغري "

slidecomment[2]="---::منتديات الوله ::---"

slidecomment[3]="---::للتميز عنوان أول إستايل سارع بحجز مقعدك معنا ::---"

slidecomment[4]="---::شبكة أجمل أحساس ::---"

slidecomment[5]="---::عالم المعرفه طريقك إلى عالم الأنتر نت ::---"

// Set the font for the comments

var slidefont="Arial Black" // نوع الخط

// Set the fontcolor for the comments

var slidefontcolor="#993300" // لون الخط

// Set the fontsize for the comments (HTML-values ranging form 1 - 6)

var slidefontsize=2 // حجم الخط

// Set the width of the pictures (pixels)

var slidewidth=500 // عرض الصورة بالبكسل

// Set the height of the pictures (pixels)

var slideheight=60 // طول الصورة بالبكسل

// Set the pause between the pictures (seconds)

var pause=5 // المدة الفاصلة بين كل صورة

///////////////////////////////////////////////////////////////////////////

// EDIT-ZONE ENDS HERE

//////////////////////////////////////////////////////////////////////////

var preloadedimages=new Array()

for (i=0;i<slideurl.length;i++){

preloadedimages[i]=new Image()

preloadedimages[i].src=slideurl[i]

}

var ns4=document.layers?1:0

var ns6=document.getElementById&&!document.all?1:0 

var ie=document.all?1:0

var imgpreload=new Array()

for (i=0;i<=slideurl.length-1;i++) {

imgpreload[i]=new Image()

imgpreload[i].src=slideurl[i]

}

var pos_left=0

var pos_top=0

var speed=20

var step=10

var i_loop=0

var i_image1=0

var i_image2=1

var i_space=""

var all_space=""

var max_space=20

var content=""

var i_slide=0

pause*=1000

function stretchimage() {

if (i_loop<=slidewidth) {

if (ie) {

imgcontainer1.innerHTML="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a>"

document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft+i_loop

imgcontainer2.innerHTML="<a href='"+slidelink[i_image2]+"' target='"+slidetarget[i_image2]+"'><img width='"+(slidewidth-i_loop)+"' height='"+slideheight+"' src='"+slideurl[i_image2]+"' border='0'></a>"

}

if (ns6) {

document.getElementById('imgcontainer1').innerHTML="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a>"

document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer1').style.left)+i_loop

document.getElementById('imgcontainer2').innerHTML="<a href='"+slidelink[i_image2]+"' target='"+slidetarget[i_image2]+"'><img width='"+(slidewidth-i_loop)+"' height='"+slideheight+"' src='"+slideurl[i_image2]+"' border='0'></a>"

}

i_loop=i_loop+step

var timer=setTimeout("stretchimage()",speed)

}

else {

clearTimeout(timer)

var imgcontent="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a><br><center><font face='"+slidefont+"' size="+slidefontsize+" color='"+slidefontcolor+"'>"+slidecomment[i_image1]+"</font></center>"

if (ie) {

imgcontainer1.innerHTML=imgcontent

document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft+i_loop    

imgcontainer2.innerHTML=""

}

if (ns6) {

document.getElementById('imgcontainer1').innerHTML=imgcontent

document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer1').style.left)+i_loop    

document.getElementById('imgcontainer2').innerHTML=""

}

changeimage()

}

}

function changeimage() {

i_loop=0

i_image1++

if (i_image1>slideurl.length-1) {i_image1=0}

i_image2=i_image1-1

if (i_image2>slideurl.length-1) {i_image2=0}

if (i_image2<0) {i_image2=slideurl.length-1}

if (ie) {

document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft

}

if (ns6) {

document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer2').style.left)

}

var timer=setTimeout("stretchimage()",pause)

}

function simpleslideshow() {

i_slide++

if (i_slide>=slideurl.length) {i_slide=0}

document.slideimage.src=preloadedimages[i_slide].src

simpleslideshowcomment()

var fadetimer=setTimeout("simpleslideshow()",pause)

}

function simpleslideshowcomment() {

if (i_space>=0){

all_space=""

content=""

for (i=0;i<i_space;i++) {

all_space+=" "

}

for (i=0;i<slidecomment[i_slide].length;i++) {

var thisletter=slidecomment[i_slide].substring(i,i+1)

thisletter=thisletter+all_space

content+=thisletter

}

window.status=content

i_space--

var fadetimer=setTimeout("simpleslideshowcomment()",20)

}

else {

clearTimeout(fadetimer)

i_space=max_space

}

}

function simpleslideshowjump() {

if (slidetarget[i_slide]=="_self") {

document.location.href=slidelink[i_slide]

} 

else if (slidetarget[i_slide]=="_blank") {

codepopup=window.open(slidelink[i_slide], "code", "status=yes,location=yes,toolbar=yes,menubar=yes,resizable=yes,scrollbars=yes,width=780,height=580,top=10,left=10");

} 

else if (slidetarget[i_slide]=="_top") {

top.location.href=slidelink[i_slide]

} 

else if (slidetarget[i_slide]=="_parent") {

parent.location.href=slidelink[i_slide]

} 

else {

var jumpto=eval("parent."+slidetarget[i_slide])

jumpto.location.href=slidelink[i_slide]

}

}

if (ie || ns6) {

var slideh=slideheight+30

document.write("<div style=\"position:relative;width:"+slidewidth+"px;height:"+slideh+"px;overflow:hidden\">")

document.write("<div id=\"imgcontainer1\" style=\"position:absolute;width:"+slidewidth+"px;height:"+slideh+"px;top:0px;left:0px\"><img src=\""+slideurl[0]+"\"></div>")

document.write("<div id=\"imgcontainer2\" style=\"position:absolute;width:"+slidewidth+"px;height:"+slideh+"px;top:0px;left:0px\"><img src=\""+slideurl[1]+"\"></div>")

document.write("</div>")

window.onload=stretchimage

}

else {

document.write("<a href=\"javascript:simpleslideshowjump()\"><img name=\"slideimage\" src=\""+slideurl[0]+"\" border=0></a>")

window.onload=simpleslideshow

}

</script> </td></tr></table> </div> <!-- /نهاية إعلانات جافا مميزه -->

**AIMAR** · 10-08-2006

تفضل عزيزي
أتمنى أنك تستفيد من هذا الكود:

انسخ هذا الكود و ضعه في منطقة HEAD:

كود:

  <script language="JavaScript1.2">
function reapply(){
setTimeout("slideit()",2000);
return true;
}
window.onerror=reapply;
</script>
<script language="JavaScript1.1">
<!--
var image1=new Image();
image1.src="1.gif";        // ضع هنا عنوان الصورة الأولى
var image2=new Image();    
image2.src="2.gif";        // عنوان الصورة الثانية
var image3=new Image();
image3.src="3.gif";        // عنوان الصورة الثالثة
//-->
</script>

:أضف هذا الكود ضمن الوسم BODY لتصبح هكذا

كود:

  <body onLoad="slideit()">

انسخ هذا الكود و ضعه في المكان الذي تريده في منطقة BODY و لا تنسى تعديل الروابط:

كود:

<a href="javascript:slidelink()" onMouseover="window.status='اضغط على الصورة';return true" onMouseout="window.status=''">
<img src="firstimage.gif" name="slide" border=0 style="filter:blendTrans(duration=3)"></a>
<script>
<!--
////change number of images below // يمكنك تغيير عدد الصور و لا تنسى تعديل السطور التي في الرأس و الروابط
var number_of_images=3;
//change speed below (in seconds) //  يمكنك تغيير السرعة أيضاً
var speed=4;        // الفارق بين كل صورة بالثواني
var step=1;
var whichimage=1;
function slideit(){
if (!document.images)
return;
if (document.all)
slide.filters.blendTrans.apply();
document.images.slide.src=eval("image"+step+".src");
if (document.all)
slide.filters.blendTrans.play();
whichimage=step;
if (step<number_of_images)
step++;
else
step=1;
if (document.all)
setTimeout("slideit()",speed*1000+3000);
else
setTimeout("slideit()",speed*1000);
}
function slidelink(){
if (whichimage==1)
window.location="http://www.google.com";  // غير للذي يناسب الصورة الأولى
else if (whichimage==2)
window.location="http://www.msn.com";     // غير للذي يناسب الصورة الثانية
else if (whichimage==3)
window.location="http://www.yahoo.com";   // غير للذي يناسب الصورة الثالثة
}
//-->
</script>

تحياتي: aimar

الموضوع: ابحث عن كود لتبديل الصور تلقائيا كل 10ثوان

أدوات الموضوع

بحث في الموضوع

ابحث عن كود لتبديل الصور تلقائيا كل 10ثوان

المواضيع المتشابهه

بحاجة الى البوم صور.. او كود يعرض الصور تلقائيا وظهور تعليق بسيط اسفل الصور..من لها؟

\\\ كود قراءة الصور البديلة تلقائيا///

ضوابط المشاركة