Go Back   CodingForums.com > :: Client side development > JavaScript programming
Reload this Page HELP: this menu slide script doesn't work on Mozilla

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-21-2005, 09:58 PM   PM User | #1
sacacorcho
New to the CF scene

 
Join Date: Jan 2005
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
sacacorcho is an unknown quantity at this point
Unhappy HELP: this menu slide script doesn't work on Mozilla
I've tried to modify this script to make it work on mozilla without success. Any help would be highly appreciatted. Thank you.

Original script

***********************
<Head>
<script language="JavaScript1.2">
var menu1top=230
var menuleft=-115


var pace=14

var step
var direction
var pause=25

var thismenu
var vorzeichen=1
var vorzeimenu1=-1


var menuismoving="no"


function inite() {
if (document.layers) {
document.menu1.left=menuleft
document.menu1.top=menu1top

}
if (document.all) {
document.all.menu1.style.posLeft=menuleft
document.all.menu1.style.posTop=menu1top
}
}

function getmenuname(clickedmenu) {
if (menuismoving=="no") {
if (document.layers) {
thismenu=eval("document."+clickedmenu)
}
if (document.all) {
thismenu=eval("document.all."+clickedmenu+".style")
}
step=pace
checkdirection()
movemenu()
}
}

function checkdirection() {
if (document.layers) {
if (thismenu==document.menu1){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
if (document.all) {
if (thismenu==document.all.menu1.style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
menuismoving="yes"
}

function movemenu() {
if (document.layers) {
if (step>=0) {
thismenu.left+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}
if (document.all) {
if (step>=0) {
thismenu.posLeft+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}
}


</script>

<style type="text/css">
#menu1 {position:absolute;left:-1000px;}
.baseline {
position:absolute;
left:250px;
top:20px;
font-family:Arial;
font-size:9pt;
color:000000;
}
</STYLE>
</head>

<BODY bgcolor="#999999" onLoad="inite()">
<div align="center"> </div>


<DIV ID="menu1"><IMG SRC="webdesign.gif" USEMAP="#webdesign.gif" WIDTH=150 HEIGHT=93 BORDER=0>
<MAP NAME="webdesign.gif">
<AREA SHAPE=RECT COORDS="117,0,150,93" HREF="javascript:getmenuname('menu1')">
<AREA SHAPE=RECT COORDS="6,18,120,74" HREF="http://www.cnet.com">
</MAP></DIV>



</body>


<!--end of oirginal script-->
************************

modified script (still not working, i wish i knew more JS ...)

************************

<Head>
<script language="JavaScript1.2">
var menu1top=230
var menuleft=-115


var pace=14

var step
var direction
var pause=25

var thismenu
var vorzeichen=1
var vorzeimenu1=-1


var menuismoving="no"


function inite() {
if (document.layers) {
document.menu1.left=menuleft
document.menu1.top=menu1top
}

if (document.getElementById&&!document.all) {
document.getElementById("menu1").style.left=menuleft
document.getElementById("menu1").style.top=menu1top
}

if (document.all) {
document.all.menu1.style.posLeft=menuleft
document.all.menu1.style.posTop=menu1top
}
}

function getmenuname(clickedmenu) {
if (menuismoving=="no") {
if (document.layers) {
thismenu=eval("document."+clickedmenu)
}
if (document.getElementById&&!document.all) {
thismenu=eval("document."+"getElementById('"+clickedmenu+"')"+".style")
}
if (document.all) {
thismenu=eval("document.all."+clickedmenu+".style")
}
step=pace
checkdirection()
movemenu()
}
}

function checkdirection() {
if (document.layers) {
if (thismenu==document.menu1){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
if (document.getElementById&&!document.all) {
if (thismenu==document.getElementById("menu1").style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
if (document.all) {
if (thismenu==document.all.menu1.style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
menuismoving="yes"
}

function movemenu() {
if (document.layers) {
if (step>=0) {
thismenu.left+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}

if (document.getElementById&&!document.all) {
if (step>=0) {
thismenu.left+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}


if (document.all) {
if (step>=0) {
thismenu.posLeft+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}
}

</script>

<style type="text/css">
#menu1 {position:absolute; left:-115px; top:230px;}
.baseline {
position:absolute;
left:250px;
top:20px;
font-family:Arial;
font-size:9pt;
color:000000;
}
</STYLE>
</head>

<BODY bgcolor="#999999" onLoad="inite()">

<DIV ID="menu1"><IMG SRC="webdesign.gif" USEMAP="#webdesign.gif" WIDTH=150 HEIGHT=93 BORDER=0>
<MAP NAME="webdesign.gif">
<AREA SHAPE=RECT COORDS="117,0,150,93" HREF="javascript:getmenuname('menu1')">
<AREA SHAPE=RECT COORDS="6,18,120,74" HREF="http://www.cnet.com">
</MAP></DIV>

</body>

<!--end of modified script-->
sacacorcho is offline   Reply With Quote
Old 01-22-2005, 03:10 PM   PM User | #2
Mr J
Senior Coder

 
Join Date: Aug 2002
Location: UK
Posts: 2,789
Thanks: 2
Thanked 14 Times in 14 Posts
Mr J is on a distinguished road
The following example will work in IE6, Mozilla, and NS7



<HTML>
<HEAD>
<TITLE>Document Title</TITLE>

<script language="javascript">
<!--
var menu1top=230
var menuleft=-115
var step = 10
var pause=50
var dir=1

function init() {
document.getElementById("menu1").style.left=menuleft
document.getElementById("menu1").style.top=menu1top
nowpos=menuleft
}


function movemenu() {
if(dir==1){nowpos+= step}
if(dir==0){nowpos-= step}

document.getElementById("menu1").style.left=nowpos
movetimer=setTimeout("movemenu()",pause)

if(nowpos>0-step){
clearTimeout(movetimer)
dir=0
}

if(nowpos<menuleft){
clearTimeout(movetimer)
dir=1
}

}

//-->
</script>

<style type="text/css">
#menu1 {position:absolute;}
.baseline {
position:absolute;
left:250px;
top:20px;
font-family:Arial;
font-size:9pt;
color:000000;
}
</STYLE>
</HEAD>

<BODY bgcolor="#999999" onload="init()">
<div align="center"> </div>


<DIV ID="menu1" ><IMG SRC="webdesign.gif" USEMAP="#webdesign.gif" WIDTH=150 HEIGHT=93 BORDER=0>
<MAP NAME="webdesign.gif">
<AREA SHAPE=RECT COORDS="117,0,150,93" HREF="#null" onclick="movemenu()">
<AREA SHAPE=RECT COORDS="6,18,120,74" HREF="http://www.cnet.com">
</MAP></DIV>

</BODY>
</HTML>
__________________
The silent one.

The most dangerous thing in the world is an idea.
The most dangerous person in the world is the one with an idea.
Mr J is offline   Reply With Quote
Old 01-22-2005, 03:10 PM   PM User | #3
sacacorcho
New to the CF scene

 
Join Date: Jan 2005
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
sacacorcho is an unknown quantity at this point
Sorry - wrong changed script (this is the right one)
sorry about that. this is the modified script.

<Head>
<script language="JavaScript1.2">
var menu1top=230
var menuleft=-115


var pace=14

var step
var direction
var pause=25

var thismenu
var vorzeichen=1
var vorzeimenu1=-1


var menuismoving="no"


function inite() {
if (document.getElementById&&!document.all) {
document.getElementById("menu1").style.left=menuleft
document.getElementById("menu1").style.top=menu1top

}
if (document.all) {
document.all.menu1.style.posLeft=menuleft
document.all.menu1.style.posTop=menu1top
}
}

function getmenuname(clickedmenu) {
if (menuismoving=="no") {
if (document.getElementById&&!document.all) {
thismenu=eval("document.getElementById('clickedmenu').style")
}
if (document.all) {
thismenu=eval("document.all."+clickedmenu+".style")
}
step=pace
checkdirection()
movemenu()
}
}

function checkdirection() {
if (document.getElementById&&!document.all) {
if (thismenu==document.getElementById("menu1").style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
if (document.all) {
if (thismenu==document.all.menu1.style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
}
menuismoving="yes"
}

function movemenu() {
if (document.getElementById&&!document.all) {
if (step>=0) {
thismenu.left+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}
if (document.all) {
if (step>=0) {
thismenu.posLeft+=step*vorzeichen
step--
var movetimer=setTimeout("movemenu()",pause)
}
else {
menuismoving="no"
clearTimeout(movetimer)
}
}
}


</script>

<style type="text/css">
#menu1 {position:absolute;left:-1000px;}
.baseline {
position:absolute;
left:250px;
top:20px;
font-family:Arial;
font-size:9pt;
color:000000;
}
</STYLE>
</head>

<BODY bgcolor="#999999" onLoad="inite()">
<div align="center"> </div>


<DIV ID="menu1"><IMG SRC="webdesign.gif" USEMAP="#webdesign.gif" WIDTH=150 HEIGHT=93 BORDER=0>
<MAP NAME="webdesign.gif">
<AREA SHAPE=RECT COORDS="117,0,150,93" HREF="javascript:getmenuname('menu1')">
<AREA SHAPE=RECT COORDS="6,18,120,74" HREF="http://www.cnet.com">
</MAP></DIV>



</body>
sacacorcho is offline   Reply With Quote
Old 01-22-2005, 03:15 PM   PM User | #4
sacacorcho
New to the CF scene

 
Join Date: Jan 2005
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
sacacorcho is an unknown quantity at this point
Smile Thank You Very Much!
THANK YOU VERY MUCH FOR YOUR SCRIPT!

it works great on both IE and Mozilla.

Regards,
NH
sacacorcho is offline   Reply With Quote
Old 01-24-2005, 03:09 AM   PM User | #5
sacacorcho
New to the CF scene

 
Join Date: Jan 2005
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
sacacorcho is an unknown quantity at this point
I'm unable ot add more than one menu-tab (when added they both move at the same time)
Thank you again for your help. when i add more than 1 tab, with different names (menu1, 2) i fail to make them move independently. sorry about my lack of knowledge in JS, your help will be appreciatted.
SC

Quote:
Originally Posted by Mr J
The following example will work in IE6, Mozilla, and NS7



<HTML>
<HEAD>
<TITLE>Document Title</TITLE>

<script language="javascript">
<!--
var menu1top=230
var menuleft=-115
var step = 10
var pause=50
var dir=1

function init() {
document.getElementById("menu1").style.left=menuleft
document.getElementById("menu1").style.top=menu1top
nowpos=menuleft
}


function movemenu() {
if(dir==1){nowpos+= step}
if(dir==0){nowpos-= step}

document.getElementById("menu1").style.left=nowpos
movetimer=setTimeout("movemenu()",pause)

if(nowpos>0-step){
clearTimeout(movetimer)
dir=0
}

if(nowpos<menuleft){
clearTimeout(movetimer)
dir=1
}

}

//-->
</script>

<style type="text/css">
#menu1 {position:absolute;}
.baseline {
position:absolute;
left:250px;
top:20px;
font-family:Arial;
font-size:9pt;
color:000000;
}
</STYLE>
</HEAD>

<BODY bgcolor="#999999" onload="init()">
<div align="center"> </div>


<DIV ID="menu1" ><IMG SRC="webdesign.gif" USEMAP="#webdesign.gif" WIDTH=150 HEIGHT=93 BORDER=0>
<MAP NAME="webdesign.gif">
<AREA SHAPE=RECT COORDS="117,0,150,93" HREF="#null" onclick="movemenu()">
<AREA SHAPE=RECT COORDS="6,18,120,74" HREF="http://www.cnet.com">
</MAP></DIV>

</BODY>
</HTML>
sacacorcho is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


« Previous Thread | Next Thread »
Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT +1. The time now is 11:57 PM.
Advertisement
Log in to turn off these ads.