اخر اعمالنا من استايلات وواجهات وتطويرات

[شقاوي الليل]

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

اخواني واخواتي الكرام


عندي واجهه وابى اضيف فيها اخر اعمالي من تصاميم للموقع او اخر تصاميمي للمنتدى

واجهات + واستايلات

ما ادري هذا الشي يمكن هو كود او اسكربت والله اعلم

اتمنى منكم تساعدوني

[تعب]

تفضل استخدم هذا الكود

<SCRIPT language=JavaScript1.2>
///////configure the below four variables to change the style of the slider///////
//set the scrollerwidth and scrollerheight to the width/height of the LARGEST image in your slideshow!
var scrollerwidth='400px'
var scrollerheight='37px'
var scrollerbgcolor=''
//3000 miliseconds=3 seconds
var pausebetweenimages=3000


//configure the below variable to change the images used in the slideshow. If you wish the images to be clickable, simply wrap the images with the appropriate <a> tag
var slideimages=new Array()
slideimages[0]='<a target="_blank" href="http://www.4yas.net"><IMG src="http://www.4yas.net/yas_smalst.gif" border=0 width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.algreeb.com/"><img border="0" src="../includes/frinds/algreeb5.gif" width="88" height="30"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.4-red.com"><img border="0" src="http://www.4-red.com/log/4-redlogo.gif" width="88" height="31"></a>'
slideimages[1]='<a target="_blank" href="http://www.3-pink.com"><IMG src="../includes/frinds/pan4.gif" border=0 width="88" height="32"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.adasaty.com"><img height="31" src="http://www.adasaty.com/pal-links/adasaty-gif.gif" width="88" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.forums-mania.com/"><img border="0" src="http://www.forums-mania.com/images/ban2.gif" width="88" height="31"></a>'
slideimages[2]='<a target="_blank" href="http://www.des4.com/"><img border="0" src="../includes/frinds/des4.gif" width="88" height="34"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.nrgse.com"><img border="0" src="http://www.nrgse.com/images/alnargsee_logo1.gif" width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.meeeem.com"><img border="0" src="http://www.meeeem.com/images/link.gif" width="88" height="31"></a>'
slideimages[3]='<a href="http://www.100spaces.com" target="_blank"><img border="0" src="http://www.100spaces.com/images/vote_image3.gif" width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="http://elegant-mood.com/" target="_blank"><img border="0" src="../includes/frinds/elegant-mood1.jpg" width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="http://www.nnjj.net" target="_blank"><img border="0" src="../includes/frinds/nnjjads.gif" width="88" height="31"></a>'
slideimages[4]='<a href="http://www.4snk.com/" target="_blank"><img border="0" src="../includes/frinds/snk_logo.gif" width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="http://www.amerabulaila.com" target="_blank"><img border="0" src="../includes/frinds/amer1.gif" width="88" height="31"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a target="_blank" href="http://www.jennyfer-online.com"><img border="0" src="../includes/frinds/link-jennyfer.gif" width="88" height="31"></a>'

//extend this list

///////Do not edit pass this line///////////////////////

var ie=document.all
var dom=document.getElementById

if (slideimages.length>1)
i=2
else
i=0

function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.left>0&&tlayer.left<=5){
tlayer.left=0
setTimeout("move1(tlayer)",pausebetweenimages)
setTimeout("move2(document.main.document.second)",pausebetweenimages)
return
}
if (tlayer.left>=tlayer.document.width*-1){
tlayer.left-=5
setTimeout("move1(tlayer)",50)
}
else{
tlayer.left=parseInt(scrollerwidth)+5
tlayer.document.write(slideimages[i])
tlayer.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.left>0&&tlayer2.left<=5){
tlayer2.left=0
setTimeout("move2(tlayer2)",pausebetweenimages)
setTimeout("move1(document.main.document.first)",pausebetweenimages)
return
}
if (tlayer2.left>=tlayer2.document.width*-1){
tlayer2.left-=5
setTimeout("move2(tlayer2)",50)
}
else{
tlayer2.left=parseInt(scrollerwidth)+5
tlayer2.document.write(slideimages[i])
tlayer2.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move3(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.left)>0&&parseInt(tdiv.style.left)<=5){
tdiv.style.left=0+"px"
setTimeout("move3(tdiv)",pausebetweenimages)
setTimeout("move4(scrollerdiv2)",pausebetweenimages)
return
}
if (parseInt(tdiv.style.left)>=tdiv.offsetWidth*-1){
tdiv.style.left=parseInt(tdiv.style.left)-5+"px"
setTimeout("move3(tdiv)",50)
}
else{
tdiv.style.left=scrollerwidth
tdiv.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move4(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.left)>0&&parseInt(tdiv2.style.left)<=5){
tdiv2.style.left=0+"px"
setTimeout("move4(tdiv2)",pausebetweenimages)
setTimeout("move3(scrollerdiv1)",pausebetweenimages)
return
}
if (parseInt(tdiv2.style.left)>=tdiv2.offsetWidth*-1){
tdiv2.style.left=parseInt(tdiv2.style.left)-5+"px"
setTimeout("move4(scrollerdiv2)",50)
}
else{
tdiv2.style.left=scrollerwidth
tdiv2.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function startscroll(){
if (ie||dom){
scrollerdiv1=ie? first2 : document.getElementById("first2")
scrollerdiv2=ie? second2 : document.getElementById("second2")
move3(scrollerdiv1)
scrollerdiv2.style.left=scrollerwidth
}
else if (document.layers){
document.main.visibility='show'
move1(document.main.document.first)
document.main.document.second.left=parseInt(scrollerwidth)+5
document.main.document.second.visibility='show'
}
}

window.onload=startscroll

    </SCRIPT> <ILAYER id=main visibility="hide" bgColor="&amp;{scrollerbgcolor};" 
      height="&amp;{scrollerheight};" width="&amp;{scrollerwidth};"><LAYER 
      id=first width="&amp;{scrollerwidth};" top="0" left="1"> <SCRIPT language=JavaScript1.2>
if (document.layers)
document.write(slideimages[0])
</SCRIPT> </LAYER><LAYER id=second visibility="hide" width="&amp;{scrollerwidth};" 
      top="0" left="0"> <SCRIPT language=JavaScript1.2>
if (document.layers)
document.write(slideimages[1])
</SCRIPT> </LAYER></ILAYER> <SCRIPT language=JavaScript1.2>
if (ie||dom){
document.writeln('<div id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;background-color:'+scrollerbgcolor+'">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0px;top:0px">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:1px;top:0px;">')
document.write(slideimages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:0px">')
document.write(slideimages[1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</div>')
}
    </SCRIPT> 

[تعب]

وجرب هذا بعد ممتااز جداًَ

<script language="javascript"> 
<!-- 
function dynObj(id,x,y,w,h) { 
    this.el = (document.getElementById)? document.getElementById(id): (document.all)? document.all[id]: (document.layers)? getLyrRef(id,document): null; 
    if (!this.el) return null; 
    this.doc = (document.layers)? this.el.document: this.el; 
    this.css = (this.el.style)? this.el.style: this.el; 
    var px = (document.layers||window.opera)? "": "px"; 
    this.x = x || 0;    if (x) this.css.left = this.x+px; 
    this.y = y || 0;    if (y) this.css.top = this.y+px; 
    this.width = w? w: (this.el.offsetWidth)? this.el.offsetWidth: (this.css.clip.width)? this.css.clip.width: 0; 
    this.height = h? h: (this.el.offsetHeight)? this.el.offsetHeight: (this.css.clip.height)? this.css.clip.height: 0; 
    // if w/h passed, set style width/height 
    if (w){ (document.layers)? this.css.clip.width=w+px: this.css.width=w+px;} 
    if (h){ (document.layers)? this.css.clip.height=h+px: this.css.height=h+px;} 
    this.obj = id + "_dynObj";     eval(this.obj + "=this"); 
} 

dynObj.prototype.show = function () { this.css.visibility = "visible"; } 
dynObj.prototype.hide = function () { this.css.visibility = "hidden"; } 

dynObj.prototype.shiftTo = function (x,y) { 
    if (x!=null) this.x=x; if (y!=null) this.y=y;     
    if (this.css.moveTo) {  
        this.css.moveTo(Math.round(this.x),Math.round(this.y));  
    } else {  
        this.css.left=Math.round(this.x)+"px";  
        this.css.top=Math.round(this.y)+"px";  
    } 
} 
dynObj.prototype.shiftBy = function (x,y) { 
    this.shiftTo(this.x+x,this.y+y); 
} 
dynObj.prototype.writeLyr = function (cntnt) { 
    if (typeof this.doc.innerHTML!="undefined") { 
      this.doc.innerHTML = cntnt; 
  } else if (document.layers) { 
            this.doc.write(cntnt); 
            this.doc.close(); 
  } 
} 

dynObj.prototype.setBgClr = function (bg) { 
    if (document.layers) this.doc.bgColor=bg; 
    else this.css.backgroundColor=bg; 
} 
function getLyrRef(lyr,doc) { 
    if (document.layers) { 
        var theLyr; 
        for (var i=0; i<doc.layers.length; i++) { 
          theLyr = doc.layers[i]; 
            if (theLyr.name == lyr) return theLyr; 
            else if (theLyr.document.layers.length > 0)  
            if ((theLyr = getLyrRef(lyr,theLyr.document)) != null) 
                    return theLyr; 
      } 
        return null; 
  } 
} 

scrollerObj.ar = new Array(); 
function scrollerObj(x,y,w,h,al,hld) { 
  this.x=x||0; this.y=y||0; this.w=w; this.h=h;  
  this.al = al || "left"; this.hld = hld; 
  this.ctr=1; this.items=new Array(); this.timerId=0; 
      this.pause     = 1500;    // مقدار التوقف للرسالة 
    this.spd         = 20;        // سرعة العرض 
    this.inc         = 2;        // مقدار التأخر 
    this.fontFam = "tahoma, helvetica, arial, sans-serif"; // أنواع الخطوط 
    this.fontSz     = "12px"; // حجم الخط 
    this.fontClr  = "#000000"; // لون الخط 
} 
function addScrollerItem(txt,url) { 
    this.items[this.items.length] = new Array(txt,url); 
} 
function setScrollerFont(fam,sz,clr) { 
    this.fontFam=fam; this.fontSz=sz; this.fontClr=clr; 
} 

function setScrollerTiming(pause,spd,inc) { 
    this.pause=pause; this.spd=spd; this.inc=inc; 
} 

function createScroller() { 
  if (this.created) return; 
    this.items[this.items.length] = this.items[0]; 
    scrollerObj.ar[scrollerObj.ar.length] = this;     
  this.obj = "scrollerObj"+scrollerObj.ar.length; eval(this.obj + "=this");  
    if (document.layers) this.buildN4(); 
    else this.build(); 
  this.created = true; 
} 
function buildScroller() { 
  var elem, str; 
  if (document.getElementById && document.createElement) { 
    elem = document.createElement("div"); 
    if (typeof this.hld != "undefined") { 
      this.holder = document.getElementById(this.hld); 
      this.scrWndo = this.holder.appendChild(elem); 
    } else { 
          this.scrWndo = document.body.appendChild(elem); 
    } 
    this.scrWndo.id = "scrWndo"+scrollerObj.ar.length; 
        this.scrWndo.style.position = "absolute"; 
    this.scrWndo.style.visibility = "hidden"; 
  } else if (document.all) { 
    str = '<div id="scrWndo'+scrollerObj.ar.length+'" style="position:absolute; visibility:hidden; "></div>'; 
    if (typeof this.hld != "undefined") { 
      this.holder = document.all[this.hld]; 
      if (typeof this.holder.innerHTML != "undefined") 
        this.holder.innerHTML = str; 
    } else { 
      document.body.insertAdjacentHTML("beforeEnd",str); 
    } 
  } 
  this.scrWndo = new dynObj("scrWndo"+scrollerObj.ar.length,this.x,this.y,this.w,this.h); 
  with (this.scrWndo.css) { 
      clip = "rect(0px, "+this.w+"px, "+this.h+"px, 0px)"; 
        overflow = "hidden"; zIndex=1000;     
    }  
  if (document.getElementById && document.createElement) { 
    elem = document.createElement("div"); 
    this.scrCont = this.scrWndo.el.appendChild(elem); 
    this.scrCont.id = "scrCont" + scrollerObj.ar.length; 
    this.scrCont.style.position = "absolute"; 
  } else if (document.all) { 
    var str = '<div id="scrCont'+scrollerObj.ar.length+'" style="position:absolute"></div>'; 
    this.scrWndo.writeLyr(str); 
  } 
  this.scrCont = new dynObj("scrCont"+scrollerObj.ar.length); 
    this.scrCont.css.visibility = "inherit";  
  this.scrCont.css.zIndex=1; 
  this.scrCont.shiftTo(0,0); 
  this.wrapItems(); 
  this.scrWndo.show(); 
  this.timerId = setTimeout(this.obj + ".controlScroll()",this.pause); 
} 
function wrapItems() { 
   var itemStart, itemEnd, str = ""; 
  if (this.al == "center") { 
    itemStart = '<table width="' + this.w + '" cellpadding="0" cellspacing="0" border="0"><tr><td style="text-align:center; height:' + this.h + 'px" valign="middle">'; 
    itemEnd = '</td></tr></table>'; 
  } else if (this.al == "left") { 
    itemStart = '<div style="height:' + this.h + 'px">'; 
    itemEnd = '</div>'; 
  } 
  for (var i=0; i<this.items.length; i++) { 
    if (typeof this.items[i][1] != "undefined") { // if item has url 
      str += itemStart + '<a style="text-decoration:none; font-family:'+this.fontFam+'; font-size:'+this.fontSz+'; color:'+this.fontClr+'" href="'+ this.items[i][1] + '">' + this.items[i][0] + '</a>' + itemEnd; 
    } else {  // no url, wrap in span with styles attached 
      str += itemStart + '<div style="font-family:'+this.fontFam+'; font-size:'+this.fontSz+'; color:'+this.fontClr+'">' + this.items[i][0] + '</div>' + itemEnd; 
    } 
  } 
  this.scrCont.writeLyr(str); 
} 

function buildScrollerNS4() { 
  // create wndo layer   
  if (typeof this.hld != "undefined") { 
    this.holder = getLyrRef(this.hld,document); 
    this.scrWndo = new Layer(this.w,this.holder); 
  } 
    else this.scrWndo = new Layer(this.w); 
    this.scrWndo.resizeTo(this.w,this.h); 
    this.scrWndo.moveTo(this.x,this.y); 

    // create the scrolling content layer  
    var str = '<div id="scrCont'+scrollerObj.ar.length+'" style="position:absolute"></div>'; 
    this.scrWndo.document.write(str); 
    this.scrWndo.document.close(); 
    this.scrCont = new dynObj("scrCont"+scrollerObj.ar.length); 
    this.scrCont.css.visibility = "inherit";  
  this.scrCont.css.zIndex=1; 
  this.scrCont.shiftTo(0,0); 
  this.wrapNS4Items(); 
    this.scrWndo.visibility = "show"; 
  this.timerId = setTimeout(this.obj + ".controlScroll()",this.pause); 
} 

function wrapNS4Items() { 
    var itemStart, itemEnd, str = ""; 
    if (this.al=="center") this.v = "middle"; 
    else this.v = "top"; 
  itemStart = '<table width="' + this.w + '" cellpadding="0" cellspacing="0" border="0"><tr><td align="'+this.al+'" height="' + this.h + '" valign="'+this.v+'">'; 
  itemEnd = '</td></tr></table>'; 
  for (var i=0; i<this.items.length; i++) { 
    if (typeof this.items[i][1] != "undefined") { // if item has url 
      str += itemStart + '<a style="text-decoration:none; font-family:'+this.fontFam+'; font-size:'+this.fontSz+'; color:'+this.fontClr+'" href="'+ this.items[i][1] + '">' + this.items[i][0] + '</a>' + itemEnd; 
    } else {  // no url, wrap in span with styles attached 
      str += itemStart + '<div style="font-family:'+this.fontFam+'; font-size:'+this.fontSz+'; color:'+this.fontClr+'">' + this.items[i][0] + '</div>' + itemEnd; 
    } 
  } 
  this.scrCont.writeLyr(str); 
} 

function controlScroll() { 
    if (this.ctr>this.items.length-1) this.startOver(); 
    else { 
        var y = parseInt(this.scrCont.css.top); 
        if (y> -this.h * this.ctr) {  
            this.scrCont.shiftBy(0,-this.inc);     
            this.timerId = setTimeout(this.obj+".controlScroll()",this.spd);     
        } else { 
                this.ctr++; 
                this.timerId = setTimeout(this.obj+".controlScroll()",this.pause);     
        } 
    } 
} 
function startOver() { 
    this.ctr = 1; 
    this.scrCont.shiftTo(0,0); 
    this.controlScroll();     
} 

scrollerObj.prototype.addItem = addScrollerItem; 
scrollerObj.prototype.create = createScroller; 
scrollerObj.prototype.setFont = setScrollerFont;  
scrollerObj.prototype.setTiming = setScrollerTiming; 
scrollerObj.prototype.buildN4 = buildScrollerNS4;  
scrollerObj.prototype.build = buildScroller; 
scrollerObj.prototype.wrapItems = wrapItems; 
scrollerObj.prototype.wrapNS4Items = wrapNS4Items; 
scrollerObj.prototype.controlScroll = controlScroll; 
scrollerObj.prototype.startOver = startOver; 
function positionGecko() { 
    if (navigator.userAgent.indexOf("Gecko")>-1) { 
    for (var i=0; i<scrollerObj.ar.length; i++) { 
            if (scrollerObj.ar[i].holder) { 
                scrollerObj.ar[i].holder.removeChild(scrollerObj.ar[i].scrWndo.el); 
                document.body.appendChild(scrollerObj.ar[i].scrWndo.el); 
                scrollerObj.ar[i].scrWndo.css.zIndex = 1000; 
        var x = scrollerObj.ar[i].holder.offsetLeft + scrollerObj.ar[i].x; 
                var y = scrollerObj.ar[i].holder.offsetTop + scrollerObj.ar[i].y; 
                scrollerObj.ar[i].scrWndo.shiftTo(x,y); 
            } 
      } 
  } 
} 
function rePosGecko() { 
  for (var i=0; i<scrollerObj.ar.length; i++) { 
        var x = scrollerObj.ar[i].holder.offsetLeft + scrollerObj.ar[i].x; 
        var y = scrollerObj.ar[i].holder.offsetTop + scrollerObj.ar[i].y; 
        scrollerObj.ar[i].scrWndo.shiftTo(x,y); 
  } 
} 

function setMouseEvents() { 
  for (var i=0; i<scrollerObj.ar.length; i++) { 
    scrollerObj.ar[i].scrCont.el.onmouseover = new Function("haltScroll("+i+")") 
    scrollerObj.ar[i].scrCont.el.onmouseout = restartScroll; 
  } 
} 

function haltScroll(num) { 
  clearTimeout(scrollerObj.ar[num].timerId); 
} 

function restartScroll(e) { 
  // get numeric portion of id (after scrCont) 
  var num = parseInt(this.id.slice(7)) - 1; 
  e = e? e: window.event? window.event: ""; 
  if (e) { 
    var current = this; 
    var related =  e.relatedTarget? e.relatedTarget: e.toElement? e.toElement: ""; 
          if (related) { 
        if (current != related && !contains(current, related))  
          scrollerObj.ar[num].controlScroll(); 
      } else scrollerObj.ar[num].controlScroll(); // ns4 
  } 
} 

// adapted from http://www.brainjar.com/dhtml/events/default6.asp 
function contains(a, b) { 
    // extra checks in case alt-tab away while over menu 
    if (b && b.parentNode) {     
      // Return true if node a contains node b. 
      while (b.parentNode) 
        if ((b = b.parentNode) == a) 
          return true; 
      return false; 
    } else if (b && b.parentElement) { 
        while (b.parentElement) 
            if ((b = b.parentElement) == a) 
              return true; 
          return false; 
    } 
} 


function initScrollerObjs() { 
scroller1 = new scrollerObj(20,0,150,50,"center","holder");// عدل هنا فقط الإرتباطات والنصوص الظاهرة 
scroller1.addItem('<a target="_blank" href="http://hams-al3mr.com"><img border="0" src="../images/ad/hams.gif" width="110" height="50" alt="مواقع ومنتديات همسات العمر"></a>  '); 
scroller1.addItem('<a target="_blank" href="http://mrx00x00.jeeran.com/"><img border="0" src="../images/ad/mrx.gif" width="110" height="50" alt="موقع نبض الغموض"></a>'); 
scroller1.addItem('<a target="_blank" href="http://ashrafnet.jeeran.com/"><img border="0" src="../images/ad/ASHRAF.gif" width="110" height="50" alt="الموقع الشخصي لأشرف نت"></a>'); 
scroller1.addItem('<a target="_blank" href="http://uaky.jeeran.com/"><img border="0" src="../images/ad/yuyu.gif" width="110" height="50" alt="موقع يوسف وياسمين الشخصي"></a>'); 
scroller1.addItem('<a target="_blank" href="http://rooh.8r8.com/"><img border="0" src="../images/ad/kloood.gif" width="110" height="50" alt="موقع خلوود الرووح"></a>'); 
scroller1.addItem('<a target="_blank" href="http://raniadk.jeeran.com/"><img border="0" src="../images/ad/rania.gif" width="110" height="50" alt="موقع رانيا الشخصي"></a>'); 

scroller1.addItem('                  '); 
scroller1.create(); 

  setMouseEvents(); // set up pause/restart onmouseover/out 
} 

window.onload = initScrollerObjs; 
//--> 
</script> 



<div align="center"> 
    <table border="0" cellpadding="0" style="border-collapse: collapse" id="table26" width="0"> 
        <tr> 
            <td id="holder" align="center" height="50" valign="top" > </td> 
        </tr> 
    </table> 
</div> 

لو تستخدم الكودين واحد للواجهات وواحد للستالات يطلع مرتب ..

[شقاوي الليل]

اخوي الغالي


ابى طريقة اضافة الكوود

كيف اضيفه في الواجهه