Menù (codici)

Crystalmoon
00lunedì 31 ottobre 2005 10:13
MENù A SCOMPARSA

esempio menu CLICCA QUI

il codice è da copiare tra <head> e </head>


<!-- Prelevato su www.web-link.it -->
<script language="JavaScript1.2">
/*
Copyright © MaXimuS 2000-2001, All Rights Reserved.
Site: www.absolutegb.com/maximus
E-mail: maximus@nsimail.com
Version: 6.1 (NS6 Compatibility)
*/

// Default settings. Don't change them.

YOffset=40; // no quotes!!
staticYOffset=40; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=1000; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
hdrFontFamily="Verdana";
hdrFontSize="3";
hdrFontColor="#000080";
hdrBGColor="#AFCCDE";
hdrAlign="right";
hdrVAlign="center";
hdrHeight="40";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="#FFF7E5";
linkOverBGColor="#FFF7E5";
linkTarget="_top";
linkAlign="left";
menuBGColor="#000080";
menuIsStatic="yes";
menuWidth=110; // Must be a multiple of 10! no quotes!!
barBGColor="#AFCCDE";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="#000080";
barVAlign="top";
barWidth=20; // no quotes!!

NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")

moving=setTimeout('null',1)
function moveOut() {
if ((NS6 && parseInt(ssm.left)<0)||(IE && ssm.style.pixelLeft<0)||(NS && document.ssm.left<0)) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed)
if (NS6) {theleft+=10;ssm.left = theleft;}
if (IE) {ssm.style.pixelLeft += 10;}
if (NS) {document.ssm.left += 10;document.ssm.clip.left-=10}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {
clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6 && parseInt(ssm.left)>(-menuWidth))||(IE && ssm.style.pixelLeft>(-menuWidth))||(NS && document.ssm.left>(-menuWidth))) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);
if (NS6) {theleft-=10;ssm.left = theleft;}
if (IE) {ssm.style.pixelLeft -= 10;}
if (NS) {document.ssm.left -= 10;document.ssm.clip.left+=10}}
else {clearTimeout(moving);moving=setTimeout('null',1)}};

lastY = 0;
function makeStatic() {
if (NS6) {winY = window.pageYOffset;}
if (IE) {winY = document.body.scrollTop;var NM=document.all('ssm').style}
if (NS) {winY = window.pageYOffset;var NM=document.ssm}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .3 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .3 * (winY - lastY);}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (NS6) {ssm.top=parseInt(ssm.top)+smooth;}
if (IE) NM.pixelTop+=smooth;
if (NS) NM.top+=smooth;
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}

function initSlide() {
if (NS6){
ssm=document.getElementById("ssm").style
ssm.visibility="visible";
ssm.left = -menuWidth;}
else if (IE) {
document.all("ssm").style.visibility = "visible"
document.all("ssm").style.pixelLeft = -menuWidth;}
else if (NS) {
document.layers["ssm"].clip.left = menuWidth;
document.layers["ssm"].left = -menuWidth;
document.layers["ssm"].visibility = "show"}
if (menuIsStatic=="yes") makeStatic();}

function reloadPage() {if(NS)location.reload()}

function startMenu(menuHeader, barText) {
if (IE||NS6) {document.write('<DIV ID="ssm" style="visibility:hidden;Position : Absolute ;Left : 0 ;Top : '+YOffset+' ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm" bgcolor="'+menuBGColor+'" left="0" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>')}
tempBar=""
for (i=0;i<barText.length;i++) {
tempBar+=barText.substring(i, i+1)+"<BR>"}
document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><tr><td bgcolor="'+hdrBGColor+'" WIDTH="'+(menuWidth-1)+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></td><td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD></tr>')
theleft=-menuWidth}

function addItem(text, link, target) {
if (!target) {target=linkTarget}
document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></TD></TR>')}

function addHdr(text) {
document.write('<tr><td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+(menuWidth-1)+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')}

function endMenu() {
document.write('<tr><td bgcolor="'+hdrBGColor+'"><font size="0" face="Arial"> </font></td></TR></table>')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV>')}
if (NS) {document.write('</LAYER>')}
if (NS6||IE||NS) setTimeout('initSlide();', 500)}

window.onresize=reloadPage

/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssmItems colors
*/
YOffset=20; // no quotes!!
staticYOffset=20; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=500; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="#006600";
menuIsStatic="yes";
menuWidth=100; // Must be a multiple of 10! no quotes!!
hdrFontFamily="verdana";
hdrFontSize="2";
hdrFontColor="#ffffff";
hdrBGColor="#006600";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="20";
linkFontFamily="Verdana";
linkFontSize="1";
linkBGColor="white";
linkOverBGColor="#66ff66";
linkTarget="_top";
linkAlign="Left";
barBGColor="#990000";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barVAlign="center";
barWidth=20; // no quotes!!

startMenu("Menu", "Forum Menu")
addItem("Home", "link.it", "");
addItem("voce 1", "link.it", "");
addItem("voce 2", "link.it", "");
addItem("voce 3", "link.it", "");
addItem("voce 4", "link.it", "");
addItem("voce 5", "link.it", "");
addItem("voce 6", "link.it", "");
addItem("voce 7", "link.it", "");
addItem("voce 8", "link.it", "");
addItem("voce 9", "link.it", "");
addItem("voce 10", "link.it", "");
addItem("voce 11", "link.it", "");
addItem("voce 12", "link.it", "");
addItem("voce 13", "link.it", "");
addItem("voce 14", "link.it", "");
addItem("voce 15", "link.it", "");
addItem("voce 16", "link.it", "");
addItem("voce 17", "link.it", "");
addItem("voce 18", "link.it", "");
addItem("voce 19", "link.it", "");
endMenu()

</script>



Una volta inserito lo script nella parte head della vostra pagina, non vi resta altro da fare che configurare e personalizzare le varie voci.

Non ci dovrebbero essere difficoltà nel configurare tutti i vari parametri ai fini di una personalizzazione. Sono infatti riconoscibili senza problemi anche se si trovano all'interno di uno script. Evitate di alterare gli apici e le virgolette, evitate anche caratteri strani come le barre / ed altro, se non strettamente necessari.


Modificato da Crystalmoon 03/11/2005 11.04
Crystalmoon
00lunedì 31 ottobre 2005 10:36
MENù DAL TASTO DX DEL MOUSE

x vedere l'esempio CLICCA QUI


<HTML>

<HEAD>


<style>

<!--



#ie5menu{

position:absolute;

width:140px;

border:2px solid black;

background-color:menu;

font-family:Verdana;

line-height:20px;

cursor:default;

visibility:hidden;

}



.menuitems{

padding-left:15px;

padding-right:15px;

}

-->

</style>



<script language="JavaScript1.2">

//set this variable to 1 if you wish the URLs of the highlighted menu to be displayed in the status bar

var display_url=0





function showmenuie5(){

ie5menu.style.left=document.body.scrollLeft+event.clientX

ie5menu.style.top=document.body.scrollTop+event.clientY

ie5menu.style.visibility="visible"

return false

}



function hidemenuie5(){

ie5menu.style.visibility="hidden"

}



function highlightie5(){

if (event.srcElement.className=="menuitems"){

event.srcElement.style.backgroundColor="highlight"

event.srcElement.style.color="white"

if (display_url==1)

window.status=event.srcElement.url

}

}



function lowlightie5(){

if (event.srcElement.className=="menuitems"){

event.srcElement.style.backgroundColor=""

event.srcElement.style.color="black"

window.status=''

}

}



function jumptoie5(){

if (event.srcElement.className=="menuitems")

window.location=event.srcElement.url

}

</script>



</HEAD>



<BODY bgcolor="white" >



<!--[if IE]>

<div id="ie5menu" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5()">

<div class="menuitems" url="LINK">ARGOMENTO</div>

<div class="menuitems" url="LINK">ARGOMENTO</div>

<div class="menuitems" url="LINK">ARGOMENTO</div>

<div class="menuitems" url="LINK">ARGOMENTO</div>

<div class="menuitems" url="LINK">ARGOMENTO</div>

<hr>

<div class="menuitems" url="LINK">ARGOMENTO</div>

</div>

<![endif]-->

<script language="JavaScript1.2">

document.oncontextmenu=showmenuie5

if (document.all&&window.print)

document.body.onclick=hidemenuie5

</script>





</body>

</html>



Allora dove è scritto link dovrete riportare appunto il link dell'argomento e dove è scritto testo l'argomento [SM=g27828]

X personalizzare font e colori e grandezza finestra basta modificare questi parametri

width:140px;

border:2px solid colorebordo;

background-color:coloresfondomenu;

font-family:Verdana;

line-height:20px;



x aggiungere le linee che dividono i vari link(magari x dividere le categorie) basta inserire
<hr>

Modificato da Crystalmoon 03/11/2005 11.16
Crystalmoon
00mercoledì 2 novembre 2005 18:59
MENU' TABS

qui troverete l'esempio CLICCA QUI

il codice è da posizionare tra <body> e </body>



<CENTER><!--Links used to initiate the sub menus. Pass in the desired submenu index numbers (ie: 0, 1) -->
<a href="LINK" onMouseover="showit(0)">ARGOMENTO PRINCIPALE</a> | <a href="LINK" onMouseover="showit(1)">ARGOMETO PRINCIPALE</a><br>

<!-- Edit the dimensions of the below, plus background color-->
<ilayer width=400 height=32 name="dep1" bgColor="#">
<layer name="dep2" width=400 height=32>
</layer>
</ilayer>
<div id="describe" style="background-color:#;width:400px;height:32px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>


<script language="JavaScript1.2">

/*
Tabs Menu (mouseover)- By Dynamic Drive
For full source code and more DHTML scripts, visit www.dynamicdrive.com
This credit MUST stay intact for use
*/

var submenu=new Array()

//Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.

submenu[0]='<font size="2" face="Verdana"><b><a href="LINK">TESTO</a> | <a href="LINK">TESTO</a> | <a href="LINK">TESTO</a> | <a href="LINK">TESTO</a> | <a href="LINK">TESTO</a></b></font>'

submenu[1]='<font size="2" face="Verdana"><b><a href="LINK">TESTO</a> | <a href="LINK">TESTO</a> | <a href="LINK">TESTO</a> | <a href="LINK">TESTO</a></b></font>'

//Set delay before submenu disappears after mouse moves out of it (in milliseconds)
var delay_hide=500

/////No need to edit beyond here

var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

function showit(which){
clear_delayhide()
thecontent=(which==-1)? "" : submenu[which]
if (document.getElementById||document.all)
menuobj.innerHTML=thecontent
else if (document.layers){
menuobj.document.write(thecontent)
menuobj.document.close()
}
}

function resetit(e){
if (document.all&&!menuobj.contains(e.toElement))
delayhide=setTimeout("showit(-1)",delay_hide)
else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhide=setTimeout("showit(-1)",delay_hide)
}

function clear_delayhide(){
if (window.delayhide)
clearTimeout(delayhide)
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

</script></CENTER>



modificando opportunamente questo parametro style="background-color:#codice colore; si potrà dare uno sfondo al riquadro che si trova sotto "argomento principale" dove appariranno i vari collegamenti..
nell'esempio il codice colore è omesso quindi il riquadro risulta trasparente


Modificato da Crystalmoon 03/11/2005 0.39
Crystalmoon
00mercoledì 2 novembre 2005 21:51
MENU SCROLLABLE
ecco l'esempio ESEMPIO MENU



<script type="text/javascript">

/***********************************************
* Scrollable Menu Links- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//configure path for left and right arrows
var goleftimage='pointer2.gif'
var gorightimage='pointer.gif'
//configure menu width (in px):
var menuwidth=300
//configure menu height (in px):
var menuheight=25
//Specify scroll buttons directions ("normal" or "reverse"):
var scrolldir="normal"
//configure scroll speed (1-10), where larger is faster
var scrollspeed=6
//specify menu content
var menucontents='<nobr><a href="LINK">ARGOMENTO</a> | <a href="LINK">ARGOMENTO</a> | <a href="LINK">ARGOMENTO</a> | <a href="LINK">ARGOMENTO</a> | <a href="LINK">ARGOMENTO</a></nobr>'


////NO NEED TO EDIT BELOW THIS LINE////////////

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('<span id="temp" style="visibility:hidden;position:absolute;top:-100;left:-5000">'+menucontents+'</span>')
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="http://www.asbafo.net/gif_ani/frecce/frecce001.gif"border=0></a> </td>')
write('<td width="'+menuwidth+'px" valign="top">')
if (iedom){
write('<div style="position:relative;width:'+menuwidth+'px;height:'+menuheight+'px;overflow:hidden;">')
write('<div id="test2" style="position:absolute;left:0;top:0">')
write('</div></div>')
}
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="http://www.asbafo.net/gif_ani/frecce/frecce002.gif"border=0></a>')
write('</td></table>')
}
}

</script>


Questa è la versione 'lo-fi' del Forum Per visualizzare la versione completa clicca qui
Tutti gli orari sono GMT+01:00. Adesso sono le 07:25.
Copyright © 2000-2024 FFZ srl - www.freeforumzone.com