: Home / JavaScript / artykuły / Przewijane Menu DHTML

Warning: file_get_contents(http://graph.facebook.com/http://youthcoders.net/javascript/artykuly/1080-przewijane-menu-dhtml.html): failed to open stream: HTTP request failed! HTTP/1.0 403 Forbidden in /var/www/old-yc/plugins/content/addthis.php on line 38
Przewijane Menu DHTML
Ocena użytkowników: / 2
SłabyŚwietny 
Wpisany przez Łukasz Miedziński   
poniedziałek, 27 czerwca 2011 17:41
Jeśli masz dużo odnośników w swoim menu, a z miejscem nie jest tak kolorowo, to ten skrypt na pewno się przyda.

 

 
Demo: Najedź myszką na czarne pole po lewej, lub po prawej stronie.
 

 
Kod skryptu:
	
<script type="text/javascript">
	
		 
	
		/***********************************************
	
		* Scrollable Menu Links- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
	
		* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
	
		* This notice must stay intact for legal use
	
		***********************************************/
	
		 
	
		//configure path for left and right arrows
	
		//Podaj ścieżkę do obrazków po lewej i prawej stronie
	
		var goleftimage='pointer2.gif'
	
		var gorightimage='pointer.gif'
	
		//configure menu width (in px):
	
		//Podaj długość menu (w pixelach):
	
		var menuwidth=300
	
		//configure menu height (in px):
	
		//Podaj wysokość menu (w pixelach):
	
		var menuheight=25
	
		//Specify scroll buttons directions ("normal" or "reverse"):
	
		//Podaj kierunki przycisków do przewijania ("normal" normalny, lub odwrócony "reverse")
	
		var scrolldir="normal"
	
		//configure scroll speed (1-10), where larger is faster
	
		//Podaj szybkość przewijania (1-10), im większa liczba tym szybciej
	
		var scrollspeed=6
	
		//specify menu content
	
		//Podaj zawartość menu
	
		var menucontents='<nobr><a href="http://www.dynamicdrive.com">Dynamic Drive</a> | <a href="http://www.javascriptkit.com">JavaScript Kit</a> | <a href="http://www.codingforums.com">CodingForums.com</a> | <a href="http://www.builder.com">Builder.com</a> | <a href="http://freewarejava.com">Freewarejava.com</a></nobr>'
	
		 
	
		 
	
		////NO NEED TO EDIT BELOW THIS LINE////////////////////////
	
		////Nie ma potrzeby edytowania wszystkiego poniżej////////
	
		 
	
		var iedom=document.all||document.getElementById
	
		var leftdircode='onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)"'
	
		var rightdircode='onMouseover="moveright()" onMouseout="clearTimeout(righttime)"'
	
		if (scrolldir=="reverse"){
	
		var tempswap=leftdircode
	
		leftdircode=rightdircode
	
		rightdircode=tempswap
	
		}
	
		if (iedom)
	
		document.write(''+menucontents+'')
	
		var actualwidth=''
	
		var cross_scroll, ns_scroll
	
		var loadedyes=0
	
		function fillup(){
	
		if (iedom){
	
		cross_scroll=document.getElementById? document.getElementById("test2") : document.all.test2
	
		cross_scroll.innerHTML=menucontents
	
		actualwidth=document.all? cross_scroll.offsetWidth : document.getElementById("temp").offsetWidth
	
		}
	
		else if (document.layers){
	
		ns_scroll=document.ns_scrollmenu.document.ns_scrollmenu2
	
		ns_scroll.document.write(menucontents)
	
		ns_scroll.document.close()
	
		actualwidth=ns_scroll.document.width
	
		}
	
		loadedyes=1
	
		}
	
		window.onload=fillup
	
		 
	
		function moveleft(){
	
		if (loadedyes){
	
		if (iedom&&parseInt(cross_scroll.style.left)>(menuwidth-actualwidth)){
	
		cross_scroll.style.left=parseInt(cross_scroll.style.left)-scrollspeed+"px"
	
		}
	
		else if (document.layers&&ns_scroll.left>(menuwidth-actualwidth))
	
		ns_scroll.left-=scrollspeed
	
		}
	
		lefttime=setTimeout("moveleft()",50)
	
		}
	
		 
	
		function moveright(){
	
		if (loadedyes){
	
		if (iedom&&parseInt(cross_scroll.style.left)<0)
	
		cross_scroll.style.left=parseInt(cross_scroll.style.left)+scrollspeed+"px"
	
		else if (document.layers&&ns_scroll.left<0)
	
		ns_scroll.left+=scrollspeed
	
		}
	
		righttime=setTimeout("moveright()",50)
	
		}
	
		 
	
		 
	
		if (iedom||document.layers){
	
		with (document){
	
		write('<table border="0" cellspacing="0" cellpadding="2">')
	
		write('<td valign="middle"><a href="#" '+leftdircode+'><img src="'+goleftimage+'"border=0></a> </td>')
	
		write('<td width="'+menuwidth+'px" valign="top">')
	
		if (iedom){
	
		write('')
	
		write('')
	
		write('')
	
		}
	
		else if (document.layers){
	
		write('<ilayer width='+menuwidth+' height='+menuheight+' name="ns_scrollmenu">')
	
		write('<layer name="ns_scrollmenu2" left=0 top=0></layer></ilayer>')
	
		}
	
		write('</td>')
	
		write('<td valign="middle"> <a href="#" '+rightdircode+'>')
	
		write('<img src="'+gorightimage+'"border=0></a>')
	
		write('</td></table>')
	
		}
	
		}
	
		 
	
		</script>	
	
		
 
 

Komentarze 

 
0 #3 Komputer 2012-04-13 08:13
Świetny pomysł .
Cytować
 
 
0 #2 Patryk yarpo Jar 2011-12-30 20:46
q ścisłości - ciekawa idea. Po zajrzeniu w kod to jednak słabo...

liczba antywzorców przeraża :/
Cytować
 
 
0 #1 Patryk yarpo Jar 2011-06-30 11:29
Fajny skrypt, jednak raczej na menu [szczególnie główne] nie jest to najlepszy pomysł :)
Cytować
 

Dodaj komentarz


Kod antysapmowy
Odśwież