Avatar billede ch007 Nybegynder
30. marts 2004 - 11:42 Der er 4 kommentarer og
2 løsninger

Javascript sidemenu og asp/Mysql

Hej.

Jeg har "stjålet" denne menu på nettet:

__________________________
HTML-filen:
<SCRIPT language=JavaScript>
<!-- Begin
var rotateMsg = true;
function MsgStatus() {
if(rotateMsg) {
window.status = '';
window.defaultStatus = 'Trial & Working Dogs welcomes you!';
}
if(!rotateMsg) {
window.status = '';
window.defaultStatus = 'Training. One step at a time!';
}
setTimeout("MsgStatus();rotateMsg=!rotateMsg", 3500);
}
MsgStatus();

function FP_goToURL(url) {//v1.0
window.location=url;
}
//  End -->
</SCRIPT>

<STYLE>A.ssmItems:link {
    COLOR: black; TEXT-DECORATION: none
}
A.ssmItems:hover {
    COLOR: blue; TEXT-DECORATION: none
}
A.ssmItems:active {
    COLOR: navy; TEXT-DECORATION: none
}
A.ssmItems:visited {
    COLOR: gold; TEXT-DECORATION: none
}
</STYLE>

<SCRIPT language=JavaScript1.2 src="slet-filer/ssm.js">
__________________________



ssm.js -filen:
__________________________


//Static Slide Menu 6.5 © MaXimuS 2000-2001, All Rights Reserved.
//Site: http://www.absolutegb.com/maximus
//E-mail: maximus@nsimail.com
//Script featured on Dynamic Drive (http://www.dynamicdrive.com)

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

tempBar='';barBuilt=0;ssmItems=new Array();

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

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

function buildBar() {
if(barText.indexOf('<IMG')>-1) {tempBar=barText}
else{for (b=0;b<barText.length;b++) {tempBar+=barText.charAt(b)+"<BR>"}}
document.write('<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>')}

function initSlide() {
if (NS6){ssm=document.getElementById("thessm").style;bssm=document.getElementById("basessm").style;
bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";}
else if (IE) {ssm=document.all("thessm").style;bssm=document.all("basessm").style
bssm.clip="rect(0 "+thessm.offsetWidth+" "+thessm.offsetHeight+" 0)";bssm.visibility = "visible";}
else if (NS) {bssm=document.layers["basessm1"];
bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
bssm2.clip.left=0;ssm.visibility = "show";}
if (menuIsStatic=="yes") makeStatic();}

function buildMenu() {
if (IE||NS6) {document.write('<DIV ID="basessm" style="visibility:hidden;Position : Absolute ;Left : '+XOffset+' ;Top : '+YOffset+' ;Z-Index : 20;width:'+(menuWidth+barWidth+10)+'"><DIV ID="thessm" style="Position : Absolute ;Left : '+(-menuWidth)+' ;Top : 0 ;Z-Index : 20;" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER name="basessm1" top="'+YOffset+'" LEFT='+XOffset+' visibility="show"><ILAYER name="basessm2"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>')}
document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'">');
for(i=0;i<ssmItems.length;i++) {
if(!ssmItems[i][3]){ssmItems[i][3]=menuCols;ssmItems[i][5]=menuWidth-1}
else if(ssmItems[i][3]!=menuCols)ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
if(ssmItems[i-1]&&ssmItems[i-1][4]!="no"){document.write('<TR>')}
if(!ssmItems[i][1]){
document.write('<td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'">&nbsp;<font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+ssmItems[i][0]+'</b></font></td>')}
else {if(!ssmItems[i][2])ssmItems[i][2]=linkTarget;
document.write('<TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV  ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'">&nbsp;<A HREF="'+ssmItems[i][1]+" target="'+ssmItems[i][2]+" CLASS="ssmItems">'+ssmItems[i][0]+'</DIV></LAYER></ILAYER></TD>')}
if(ssmItems[i][4]!="no"&&barBuilt==0){buildBar();barBuilt=1}
if(ssmItems[i][4]!="no"){document.write('</TR>')}}
document.write('</table>')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV></DIV>')}
if (NS) {document.write('</LAYER></ILAYER></LAYER>')}
theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1)}



__________________________

ssmItems.js-filen:

__________________________




<!--

/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
*/
YOffset=150; // no quotes!!
XOffset=0;
staticYOffset=30; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="gold";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
menuWidth=150; // Must be a multiple of 10! no quotes!!
menuCols=2;
hdrFontFamily="arial narrow bold";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="#170088";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="15";
linkFontFamily="arial narrow bold";
linkFontSize="2";
linkBGColor="lightyellow";
linkOverBGColor="#FFFF99";
linkTarget="_top";
linkAlign="Left";
barBGColor="#444444";
barFontFamily="arial narrow bold";
barFontSize="2";
barFontColor="white";
barVAlign="center";
barWidth=20; // no quotes!!
barText="SIDE MENU"; // <IMG> tag supported. Put exact html for an image to show.

///////////////////////////

// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header

ssmItems[0]=["START PAGE", "http://www.bordercollin.dk/", ""]
ssmItems[1]=["MENU", "http://www.bordercollin.dk/menu.htm", ""]
ssmItems[2]=["OUR DOGS", "http://www.bordercollin.dk/our%20dogs.htm", ""]
ssmItems[3]=["RESULTS", "http://www.bordercollin.dk/Results 2004.htm", ""]
ssmItems[4]=["CLINICS", "http://www.bordercollin.dk/clinic's.htm", ""]
ssmItems[5]=["KURSER", "http://www.bordercollin.dk/clinics.dk.htm", ""]
ssmItems[6]=["PHOTOS", "http://www.bordercollin.dk/photo.htm", ""]
ssmItems[7]=["WWW.LINKS", "http://www.bordercollin.dk/www.links.htm", ""]
ssmItems[8]=["TRAINING", "http://www.bordercollin.dk/training1.htm", ""]
ssmItems[9]=["TRÆNING", "http://www.bordercollin.dk/training__dansk.htm", ""]
ssmItems[10]=["GUEST BOOK", "http://pub20.bravenet.com/guestbook/show.php?usernum=1717203740&vid=", ""]
ssmItems[11]=["LATEST NEWS", "http://www.bordercollin.dk/news.htm", ""]
ssmItems[12]=["YOUR HOSTS", "http://www.bordercollin.dk/hosts.htm", ""]
ssmItems[13]=["FOR SALE", "http://www.bordercollin.dk/for-sale.htm", ""]

buildMenu();

//-->


____________________________

Jeg har ikke forstand på java overhovedet!

I filen: ssmItems.js kan jeg se hvor linksene imenuen er skrevet ind. Kan jeg lave sådan at den hente disse menu-punkter fra vha asp - altså fra en database? Kan jeg indsætte database-kode-hentning i en js. fil eller kan jeg kæde js filen ind i min html-fil?

Et andetspg. er der en god side med gratis Java-scripts? Jeg havde en gang et link,men det er væk nu :-(
Avatar billede roenving Novice
30. marts 2004 - 22:01 #1
Du kan sagtens hente fra din database, men så skal du kalde script-filen for .asp, og så lave et asp-script, som returnerer den gyldige javascript, men jeg ledte forgæves efter kaldet til filen, for det skal så være:

<script type="text/javascript" language=JavaScript1.2 src="slet-filer/ssm.js">
<script type="text/javascript" language=JavaScript1.2 src="slet-filer/ssmItems.asp">

-- men f.eks.

ssmItems.asp (pseudo-kode, for asp er ikke noget jeg er bevandret i !-)

Hele starten af filen til og med:

barText="SIDE MENU"; // <IMG> tag supported. Put exact html for an image to show.

///////////////////////////

// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header

'dit database-opslag
'her set som rs()-array

i=-1
do while not eof
i=i+1
Response.Write "ssmItems["&i&"]=[\""&rs("title")&"\",\""&rs("link")&"\",\"\"]"&vbcrlf
loop
Avatar billede roenving Novice
30. marts 2004 - 22:04 #2
Hov, et par detaljer:

<%
'dit database-opslag
'her set som rs()-array

i=-1
do while not eof
i=i+1
Response.Write "ssmItems["&i&"]=[\""&rs("title")&"\",\""&rs("link")&"\",\"\"]"&vbcrlf
loop
%>

buildMenu();


-- og så lige et link:
http://www.javascript.com/
Avatar billede ch007 Nybegynder
31. marts 2004 - 09:36 #3
http://www.a-begynder.dk/scripts/javascript/andet/javascript_sidemenu.htm

Jeg havde selv fundet en løsning med denne menu - det hele er i en fil og så kan jeg selv løse det :-)

Roenving smider du lige et svar, så kan vi dele point for din ulejlighed...
Avatar billede roenving Novice
31. marts 2004 - 17:18 #4
Jamen, så velbekomme !-)
Avatar billede ch007 Nybegynder
02. april 2004 - 10:25 #5
Tak!
Avatar billede roenving Novice
02. april 2004 - 11:40 #6
-- og tak for points ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester