عرض الصور والتصاميم بشكل صفحات مرقّمه (متحرك) [الأرشيف]

admin

10-31-2013, بتوقيت غرينيتش 02:53 AM

http://www.dzbatna.com/images/icons/iconrote.gif ط¹ط±ط¶ ط§ظ„طµظˆط± ظˆط§ظ„طھطµط§ظ…ظٹظ… ط¨ط´ظƒظ„ طµظپط*ط§طھ ظ…ط±ظ‚ظ‘ظ…ظ‡ (ظ…طھط*ط±ظƒ) (http://www.dzbatna.com/t1612422/)

بسم الله الرحمن الرحيم

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

كود code رائع وان شاء الله يعجبكم
الكود code اعجب احد ااعضاء ديزاد باتنة هنا في ركن طلبات المنتديات من احد المنتديات وعطاني المثال وجبته له
http://www.dzbatna.com/images/smilies/nosweat.gif

وقلت ليه ما انزله عشان يستفيد منه الجميع وان شاء الله مايكون مكرر لاني بحثت عنه هنا مالقيته
الكود code يعرض الصور او التصاميم او الاعلانات بشكل متحرك وجميل
ومتوافق مع جميع الاستايل styleات بحيث يكون لونة من لون الاستايل style

تم ادراج الكود code بدون روابط تشعيبيه ..في المرفقات

المثال

مصوّر

http://www.shr-1.com/up//uploads/images/--bdr--ac0581ea69.jpg

مثال حي

اسفل الهيدر header

اضغط هنا (http://www.alrams.net/forum)

الكود code :

رمز Code:
 <style type="text/css"> .contentslide { padding: 0px; margin: 0px; width: 450px; } .contentslide .contentdiv { display: none; } .pagination { width: 450px; text-align: right; /*background-color: #CCC;*/ border: 10px solid navy; border-width: 0 0px; padding: 0 0 2px 0; } * html .pagination { width: 450px; w/idth: 450px; } .pagination a { padding: 0 5px; text-decoration: none; color: #BECBDB; font-weight:bold ; /* background-color: #CCC;*/ } .pagination a:hover, .pagination a.selected { color: #FF0000; border:1px #FF0000 solid; font-size:9pt; } .my_desc { width:auto; height:20px; background-color:#FFF; opacity:0.6; filter:alpha(opacity=60); position:relative; top:280px; text-align:right; font-weight:bold; text-indent:5px; } </style>   <script type="text/javascript"> var csbustcachevar=0 var csloadstatustext="<img src='loading.gif' /> Requesting content..." var csexternalfiles=[] var imgggg="التالي" //don't edit below var enablepersist=true var slidernodes=new Object() var csloadedobjects="" function ContentSlider(sliderid, autorun){ var slider=document.getElementById(sliderid) slidernodes[sliderid]=[] ContentSlider.loadobjects(csexternalfiles) var alldivs=slider.getElementsByTagName("div") for (var i=0; i<alldivs.length; i++){ if (alldivs[i].className=="contentdiv"){ slidernodes[sliderid].push(alldivs[i]) if (typeof alldivs[i].getAttribute("rel")=="string") ContentSlider.ajaxpage(alldivs[i].getAttribute("rel"), alldivs[i]) } } ContentSlider.buildpagination(sliderid) var loadfirstcontent=true if (enablepersist && getCookie(sliderid)!=""){ var cookieval=getCookie(sliderid).split(":") if (document.getElementById(cookieval[0])!=null && typeof slidernodes[sliderid][cookieval[1]]!="undefined"){ ContentSlider.turnpage(cookieval[0], parseInt(cookieval[1])) loadfirstcontent=false } } if (loadfirstcontent==true) ContentSlider.turnpage(sliderid, 0) if (typeof autorun=="number" && autorun>0) window[sliderid+"timer"]=setTimeout(function(){ContentSlider.autoturnpage( sliderid, autorun)}, autorun) } ContentSlider.buildpagination=function(sliderid){ var paginatediv=document.getElementById("paginate-"+sliderid) var pcontent="" for (var i=0; i<slidernodes[sliderid].length; i++) pcontent+='<a href="#" onClick=\"ContentSlider.turnpage(\''+sliderid+'\', '+i+'); return false\">'+(i+1)+'</a> ' pcontent+='<a href="#" style="font-weight: bold;" onClick=\"ContentSlider.turnpage(\''+sliderid+'\', parseInt(this.getAttribute(\'rel\'))); return false\">'+imgggg+'</a>' paginatediv.innerHTML=pcontent paginatediv.onclick=function(){ if (typeof window[sliderid+"timer"]!="undefined") clearTimeout(window[sliderid+"timer"]) } } ContentSlider.turnpage=function(sliderid, thepage){ var paginatelinks=document.getElementById("paginate-"+sliderid).getElementsByTagName("a") for (var i=0; i<slidernodes[sliderid].length; i++){ paginatelinks[i].className="" slidernodes[sliderid][i].style.display="none" } paginatelinks[thepage].className="selected" slidernodes[sliderid][thepage].style.display="block" paginatelinks[paginatelinks.length-1].setAttribute("rel", thenextpage=(thepage<paginatelinks.length-2)? thepage+1 : 0) if (enablepersist) setCookie(sliderid, sliderid+":"+thepage) } ContentSlider.autoturnpage=function(sliderid, autorunperiod){ var paginatelinks=document.getElementById("paginate-"+sliderid).getElementsByTagName("a") var nextpagenumber=parseInt(paginatelinks[paginatelinks.length-1].getAttribute("rel")) ContentSlider.turnpage(sliderid, nextpagenumber) //Show that DIV window[sliderid+"timer"]=setTimeout(function(){ContentSlider.autoturnpage( sliderid, autorunperiod)}, autorunperiod) } function getCookie(Name){ var re=new RegExp(Name+"=[^;]+", "i"); if (document.cookie.match(re)) return document.cookie.match(re)[0].split("=")[1] return "" } function setCookie(name, value){ document.cookie = name+"="+value } ContentSlider.ajaxpage=function(url, thediv){ var page_request = false var bustcacheparameter="" if (window.XMLHttpRequest) page_request = new XMLHttpRequest() else if (window.ActiveXObject){ try { page_request = new ActiveXObject("Msxml2.XMLHTTP") } catch (e){ try{ page_request = new ActiveXObject("Microsoft.XMLHTTP") } catch (e){} } } else return false thediv.innerHTML=csloadstatustext page_request.onreadystatechange=function(){ ContentSlider.loadpage(page_request, thediv) } if (csbustcachevar) bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime() page_request.open('GET', url+bustcacheparameter, true) page_request.send(null) } ContentSlider.loadpage=function(page_request, thediv){ if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)) thediv.innerHTML=page_request.responseText } ContentSlider.loadobjects=function(externalfiles){ for (var i=0; i<externalfiles.length; i++){ var file=externalfiles[i] var fileref="" if (csloadedobjects.indexOf(file)==-1){ if (file.indexOf(".js")!=-1){ fileref=document.createElement('script') fileref.setAttribute("type","text/javascript"); fileref.setAttribute("src", file); } else if (file.indexOf(".css")!=-1){ fileref=document.createElement("link") fileref.setAttribute("rel", "stylesheet"); fileref.setAttribute("type", "text/css"); fileref.setAttribute("href", file); } } if (fileref!=""){ document.getElementsByTagName("head").item(0).appe ndChild(fileref) csloadedobjects+=file+" " } } } </script>  <br> <table class="tborder" style="border-collapse: collapse;" width="500" align="center" border="1" cellpadding="6" cellspacing="1"> <thead> <tr> <td class="tcat" align="center" height="20"> <a style="float: left;" href="#top" onclick="return toggle_collapse('rmsh_fnews_system')"><img id="collapseimg_rmsh_fnews_system" src="http://www.alrams.net/forum/rms-css/buttons/collapse_thead.gif" alt="" border="0"></a>..:: ابداعات : تصاميم ::..</td> </tr></thead><tbody id="collapseobj_rmsh_fnews_system" style=""> <tr> <td class="alt1"> <div align="center"> <div id="slider1" class="contentslide"> <div class="opacitylayer">   <div style="display: none;" class="contentdiv" id="slideshow"> <a href="http://www.vb.aenhail.com"> <span style="font-weight: 700; font-size: 14px">تصاميم</span></a><a href="http://www.alrams.net/forum/showthread.php?p=574725#post574725" target="_blank" title="وصف "> </a> <br><br> <a target="_blank" href="رابط الموضوع"> <img title="تصاميم" src="http://hanen2200.jeeran.com/aatttb.gif" alt="تصاميم" style="border: 0px none; width: 450px; height: 300px;"></a><a style="" href="http://www.vb.aenhail.com" target="_blank"> </a> <br><br> <div class="smallfont"><b><font size="4">تصاميم <font color="#FF0000">: حنين الشوق</font> </font></b> </div> </div>    <div style="display: none;" class="contentdiv" id="slideshow"> <a href="http://www.vb.aenhail.com"> <span style="font-weight: 700; font-size: 14px">تصاميم</span></a><a href="http://www.alrams.net/forum/showthread.php?p=574725#post574725" target="_blank" title="وصف "> </a> <br><br> <a target="_blank" href="رابط الموضوع"> <img title="تصاميم" src="http://hananalshog.googlepages.com/ooozh.jpg" alt="تصاميم" style="border: 0px none; width: 450px; height: 300px;"></a><a style="" href="http://www.vb.aenhail.com" target="_blank"> </a> <br><br> <div class="smallfont"><b><font size="4">تصاميم <font color="#FF0000">: حنين الشوق</font> </font></b> </div> </div>    <div style="display: none;" class="contentdiv" id="slideshow"> <a href="http://www.vb.aenhail.com"> <span style="font-weight: 700; font-size: 14px">تصاميم</span></a><a href="http://www.alrams.net/forum/showthread.php?p=574725#post574725" target="_blank" title="وصف "> </a> <br><br> <a target="_blank" href="رابط الموضوع"> <img title="تصاميم" src="http://www.shr-1.com/up//uploads/images/--bdr--320cac8576.gif" alt="تصاميم" style="border: 0px none; width: 450px; height: 300px;"></a><a style="" href="http://www.vb.aenhail.com" target="_blank"> </a> <br><br> <div class="smallfont"><b><font size="4">تصاميم <font color="#FF0000">: حنين الشوق</font> </font></b> </div> </div>    <div style="display: none;" class="contentdiv" id="slideshow"> <a href="http://www.vb.aenhail.com" target="_blank" title="عين حائل "> <span style="font-weight: 700; font-size: 14px">تصاميم </span> </a> <br><br> <a target="_blank" href="رابط الموضوع"> <img title="تصاميم" src="http://www.shr-1.com/up//uploads/images/--bdr--fb7be6a5c0.gif" alt="تصاميم" style="border: 0px none; width: 450px; height: 300px;"></a><a href="http://www.vb.aenhail.com" target="_blank"> </a> <br><br> <div class="smallfont"><b><font size="4">تصاميم <font color="#FF0000">: حنين الشوق </font></font></b></div> </div>   </div> </div> <br>  <div class="pagination alt2" id="paginate-slider1"><a class="" href="#" onclick="ContentSlider.turnpage('slider1', 0); return false">1</a> <a class="selected" href="#" onclick="ContentSlider.turnpage('slider1', 1); return false">2</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 2); return false">3</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 3); return false">4</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 4); return false">5</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 5); return false">6</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 6); return false">7</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 7); return false">8</a> <a class="" href="#" onclick="ContentSlider.turnpage('slider1', 8); return false">9</a> <a rel="2" href="#" style="font-weight: bold;" onclick="ContentSlider.turnpage('slider1', parseInt(this.getAttribute('rel'))); return false">التالي</a></div>  </div> </td></tr></tbody></table> <script type="text/javascript"> //Define: ContentSlider("slider_ID", [autorotate_miliseconds], [custompaginatelinkstext], [customnextlinktext]) //ContentSlider("slider1") //OR ContentSlider("slider1", 3000) ContentSlider("slider1", 6000, "",">>") //OR ContentSlider("slider1", 3000, linktextarray, "Foward") //OR ContentSlider("slider1", "", linktextarray) //OR ContentSlider("slider1", "", "", "Foward") </script> <br>   

طريقة التركيب install

+ انسخ الكود code وعدل عليه بالفرونت بيج بحيث تستبدل الصور والكلمات العربيه بما تريده انت

+ بعد التعديل الصق الكود code في اسفل الهيدر header او في اي مكان تريده انت

انتهى

واخيرا دعواتكم لي ولوالدي

التعديل الأخير كان بواسطة bdr-9; 10 - 07 - 2014 الساعة 04:22

ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)

الملفات المرفقة
http://www.traidnt.net/vb/images/attach/txt.gif كود عرض الصور بدون روابط تشعيبيه.txt (http://www.traidnt.net/vb/attachments/499012d1278723999-كود-عرض-الصور-بدون-روابط-تشعيبيه.txt) (11.2 كيلوبايت, عدد مرات المشاهدة 83 مرة)

http://www.traidnt.net/vb/images/attach/txt.gif كود عرض الصور بروابط تشعيبيه.txt (http://www.traidnt.net/vb/attachments/499013d1278724064-كود-عرض-الصور-بروابط-تشعيبيه.txt) (11.4 كيلوبايت, عدد مرات المشاهدة 79 مرة)

https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع