»
AnglaisFrançaisVietnamien

Imprimer - Hyperlien Script graphique Slider - JavaScriptBank.com

Version complète: jsB@nk » Image » Visualiseur d'images » Hyperlien Script graphique Slider
URL: https://www.javascriptbank.com/graphical-hyperlink-slider-script-index.html

Hyperlien Script graphique Slider © JavaScriptBank.comCe script vous permet d'avoir un nombre (minimum de 6) de l'image des liens de défilement en continu dans le haut de votre page. Surtout utile si vous avez une tonne de liens, mais n'ont pas la place pour eux tous. Ou avec un peu de retouches, il pourrait mettre en place ce script pour afficher des bannières publicitaires.

Version complète: jsB@nk » Image » Visualiseur d'images » Hyperlien Script graphique Slider
URL: https://www.javascriptbank.com/graphical-hyperlink-slider-script-index.html



CSS
<style type="text/css">td {color:#dddddd}td.bk {color:black}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT language=JavaScript1.2>//---------------------------------------------------------------------//'SLIDES' SCRIPT  WRITTEN BY RICHARD MALONEY RM@HISMERCY.CA//----------------------------------------------------------------------var numOfSlides=6; //CHANGE THIS TO NUMBER OF HTML SLIDES DEFINED BELOW (MINIMUM 6)//SIMPLE SNIFFER-( IT WON'T BE LONG TILL THIS ORDER IS REVERSED// ( AFTER THAT SAY GOODBYE TO LAYER AND ALL :-)// ( SO WRITE YOUR SCRIPTS FOR W3C FIRST! )  var IE = (document.all) ? true:falsevar NS = (document.layers) ? true:falsevar W3C = (document.getElementById) ? true:false//TAKES ID AND RETURNS DOM ELEMENTfunction getCSSPElement(id) {if (IE)  return document.all[id]else if (NS) return document.layers[id]else return document.getElementById(id)}//TAKES DOM AND (MOVES SLIDE LEFT) RETURNS THE NEW HORIZONTAL POSITIONfunction offsetLeft(el,amount) {if (IE){return (el.style.pixelLeft-=amount)}else if (NS){return (el.left-=amount)}else {el.style.left = parseInt(el.style.left) - amount + "px"; return (el.style.left)}}function moveSlides(id){var el = getCSSPElement(id)var t=parseInt(offsetLeft(el,4)) //parseInt to work w/W3Cif ((t>=el.start-140)&&(t<=el.start-138)){startNextSlide(el)} el.scrollID = window.setTimeout("moveSlides('" + id + "')",75)       if (t<=el.end) {       if (IE){el.style.pixelLeft=el.start;}else if (NS){el.left=el.start;} else {el.style.left=el.start + "px";}clearTimeout(el.scrollID); }}//GETS NEXT SLIDES NAME FROM PASSED ELEMENT AND ASSIGNS THE NEW THREADID TO OBJECT.SCROLLIDfunction startNextSlide(el) {var elnext=getCSSPElement(el.next)elnext.scrollID = window.setTimeout("moveSlides('" + el.next + "')",100)}//INITIALIZATION (NUMBERS BASED ON SCREEN LOCATIONS FOR TWO OVERLAY DIVS)function intializeSlideShow(){startPosition=screen.width-223; //starting position (x) of slideendPosition=80;//ending point of imagefor (var i=0;i<numOfSlides;i++){//iterate through number of slidesvar el = getCSSPElement("s"+i)//returns object (var makes scope local to function)el.start=startPosition//know thy starting point object  (no var so global)el.end=endPosition//know thy ending point objectel.next="s"+(i+1);if (i==(numOfSlides-1)) el.next="s0"; //know the next slide tooif(IE)el.style.pixelLeft=el.start;  //moves slide in Explorer to IT's starting pointelse if (NS) el.left=el.start;//moves slide in netscape to IT's starting pointelse el.style.left=el.start+ "px";//moves slide in W3C DOM  to IT's starting point}//POSITION RIGHT OVERLAY BASED ON SCREEN WIDTH if(IE)document.all["rightBlock"].style.pixelLeft=screen.width-258;else if (NS)document.layers["rightBlock"].left=screen.width-250;else document.getElementById("rightBlock").style.left=screen.width-250 + "px";}//WINDOW RESIZE/LOADwindow.resizeTo(screen.width,screen.height);window.moveTo(0,0);window.onload=function(){ intializeSlideShow(); moveSlides('s0'); }</SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY bgcolor="black" link="white" vlink="white" alink="white" text="white"><DIV id=s0 style="POSITION: absolute; TOP: 0px"><A href="http://your_link1.com"><IMG border=0 height=79 name=slide0 src="test1.gif" width=120></A></DIV><DIV id=s1 style="POSITION: absolute; TOP: 0px"><A href="http://your_link2.com"><IMG border=0 height=79 name=slide1 src="test2.gif" width=120></A></DIV><DIV id=s2 style="POSITION: absolute; TOP: 0px"><A href="http://your_link3.com"><IMG border=0 height=79 name=slide2 src="test3.gif" width=120></A></DIV><DIV id=s3 style="POSITION: absolute; TOP: 0px"><A href="http://your_link4.com"><IMG border=0 height=79 name=slide3 src="test4.gif" width=120></A></DIV><DIV id=s4 style="POSITION: absolute; TOP: 0px"><A href="http://your_link5.com"><IMG border=0 height=79 name=slide4 src="test5.gif" width=120></A></DIV><DIV id=s5 style="POSITION: absolute; TOP: 0px"><A href="http://your_link6.com"><IMG border=0 height=79 name=slide5 src="test6.gif" width=120></A></DIV><!-- THESE ARE THE PICTURES AT EITHER END. --><DIV id=leftBlock style="LEFT: 0px; POSITION: absolute; TOP: 0px"><IMG alt="" border=0 height=79 src="scrollFaderWred_left_79h.gif" width=225></DIV><DIV id=rightBlock style="LEFT: 0px; POSITION: absolute; TOP: 0px"><IMG alt="" border=0 height=79 src="scrollFaderWred_right_79h.gif" width=225></DIV></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/image/Graphical_Hyperlink_Slider_Script/Graphical_Hyperlink_Slider_Script_images.zip