Welcome to WebmasterWorld Guest from 54.211.136.250

Forum Moderators: not2easy

Message Too Old, No Replies

Putting Javascript in .css file..

real newbie to css

   
4:31 pm on Jul 28, 2003 (gmt 0)

10+ Year Member



I am not very familiar with CSS, but am trying to put together a webpage that uses CSS and some javascript.

The Javascript is from Dynamic Drive [dynamicdrive.com].

My question, is if I can put the long Script, that is supposed to follow the BODY tag, inside a .css file? Will I have to change it a bit, or just put it in as is?

This is the code I want to get into the .css file:


<script language="JavaScript1.2">

/***********************************************
* Fold-out external menu- Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var slidemenu_height=315 //specify height of menu
var slidemenu_width=160 //specify width of menu (in pixels)
var slidemenu_reveal=12 //specify amount that menu should protrude initially
var slidemenu_top=170 //specify vertical offset of menu on page
var slidemenu_url="menu.htm" //specify path to menu file

var ns4=document.layers?1:0
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
var ns6=document.getElementById&&!document.all?1:0

if (ie4¦¦ns6)
document.write('<iframe id="slidemenubar2" style="left:'+((slidemenu_width-slidemenu_reveal)*-1)+'; top:'+slidemenu_top+'; width:'+slidemenu_width+'; height:'+slidemenu_height+'" src="'+slidemenu_url+'"></iframe>')
else if (ns4){
document.write('<style>\n#slidemenubar{\nwidth:'+slidemenu_width+';}\n<\/style>\n')
document.write('<layer id="slidemenubar" left=0 top='+slidemenu_top+' width='+slidemenu_width+' height='+slidemenu_height+' onMouseover="pull()" onMouseout="draw()" src="'+slidemenu_url+'" visibility=hide></layer>')
}
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (ns4){
document.slidemenubar.left=((slidemenu_width-slidemenu_reveal)*-1)
document.slidemenubar.visibility="show"
setTimeout("window.onresize=regenerate",400)
}
}

window.onload=regenerate2

rightboundary=0
leftboundary=(slidemenu_width-slidemenu_reveal)*-1

if (ie4¦¦ns6){
document.write('</div>')
themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style
}
else if (ns4){
document.write('</layer>')
themenu=document.layers.slidemenubar
}

function pull(){
if (window.drawit)
clearInterval(drawit)
pullit=setInterval("pullengine()",10)
}
function draw(){
clearInterval(pullit)
drawit=setInterval("drawengine()",10)
}
function pullengine(){
if ((ie4¦¦ns6)&&parseInt(themenu.left)<rightboundary)
themenu.left=parseInt(themenu.left)+10
else if(ns4&&themenu.left<rightboundary)
themenu.left+=10
else if (window.pullit){
themenu.left=0
clearInterval(pullit)
}
}

function drawengine(){
if ((ie4¦¦ns6)&&parseInt(themenu.left)>leftboundary)
themenu.left=parseInt(themenu.left)-10
else if(ns4&&themenu.left>leftboundary)
themenu.left-=10
else if (window.drawit){
themenu.left=leftboundary
clearInterval(drawit)
}
}

</script>

Thanks for any info or suggestions! :)

Jennifer.

4:42 pm on Jul 28, 2003 (gmt 0)

10+ Year Member



I don't think you can put javascript in a css file IMO. You can put whats between the style tags into a css file. And you can put your javascript functions into a .js file. For example:

<script language="JavaScript1.2" src="yourfile.js" type="text/javascript">
</script>

4:45 pm on Jul 28, 2003 (gmt 0)

10+ Year Member



No you cant put javascipt in a css file.

What you want is to put it in a js file.

<script src="yourscript.js" type="text/javascript">

4:46 pm on Jul 28, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome to WebmasterWorld JenniferD :)

Please don't put javascript inside a css file. The css file is intended for style commands and not javascript.

You can put the javascript in a "js" file in stead. Copy the script to an empty text file and call it, eg. "javascript.js".

Then, in your html document, after your <body> tag, include this line:

<script src="http://www.example.com/javascript.js" type="text/javascript"></script>

- and make sure to replace "example.com" with the relevant address.

/claus

8:11 pm on Jul 28, 2003 (gmt 0)

10+ Year Member



Thank you! I'll try that out later. :)

Jennifer