Two javascripts. One page. One external Stylesheet. BIG problem. So amateur.

laundromat1967 · #1 (**permalink**) Aug 23rd, 2007, 21:48

Alright. To begin, I am a complete javascript newbie. I know nothing but HTML, so please, please, please use simple web-language

It would be most appreciated. So this is my problem:

This is the code I have on my page:

<head>
<link rel="stylesheet" type="text/css" href="scw.css" />
<script type="text/javascript" src="scrollablecontent.js"></script>
<script type="text/javascript">
scw1 = new SCWindow("scw1",446,317);
scw2 = new SCWindow("scw2",100,200);
</script>

<script type="text/javascript">scw1.endblock()</script>
<SPAN STYLE="z-index: 1;position:absolute; left:649px; top:634px; background-color:transparent;" >
<script type="text/javascript">scw1.makecontrols("upb.gif","downb.gif ")</script>
</SPAN>
<script type="text/javascript">
function start(){
scw1.initialize()
scw2.initialize()
}
window.onload=start
</script>
</body>

The link rel scrollablecontent.js is here:

function SCWindow(name,width,height){
this.name = name
this.objname = name
this.width = width
this.height = height
this.contentwidth = this.width - 4
//specify speed of scroll (greater=faster)
this.speed = 5
}

SCWindow.prototype.initialize = function(){
var id = this.name + "content"
var id2 = this.name + "content2"
this.crossobj = document.getElementById? document.getElementById(id2) : document.all[id2]
this.contentbox = document.getElementById? document.getElementById(id) : document.all[id]
this.contentheight=this.crossobj.offsetHeight
this.contentbox.style.height = this.contentheight + "px"
this.limit = this.height-this.contentheight
}

SCWindow.prototype.movedown = function (){
var thisthis = this
var topint = parseInt(this.crossobj.style.top)
if (topint>=this.limit){
this.crossobj.style.top=topint-this.speed+"px"
this.movedownvar=setTimeout(function(){thisthis.mo vedown()},30)
}
}

SCWindow.prototype.moveup = function (){
var thisthis = this
var topint = parseInt(this.crossobj.style.top)
if (topint<0){
this.crossobj.style.top=topint+this.speed+"px"
this.moveupvar=setTimeout(function(){thisthis.move up()},30)
}
}

SCWindow.prototype.pagedown = function (){
var thisthis = this
var topint = parseInt(this.crossobj.style.top)
if (topint>=this.limit){
val = topint -(this.height - 10)
if (val<this.limit){val=this.limit}
this.crossobj.style.top=val+"px"
}
}

SCWindow.prototype.pageup = function (){
var thisthis = this
var topint = parseInt(this.crossobj.style.top)
if (topint<0){
var val = (topint+this.height) - 10
if(val > 0){val = 0}
this.crossobj.style.top=val+"px"
}
}

SCWindow.prototype.stop = function (){
clearTimeout(this.moveupvar)
clearTimeout(this.movedownvar)
}

SCWindow.prototype.control = function(cont){
this.stop()
switch (cont) {
case "up" : this.moveup(); break;
case "down" : this.movedown(); break;
case "pgup" : this.pageup(); break;
case "pgdn" : this.pagedown(); break;
case "play" : this.movedown(); break;
case "reverse": this.moveup();
}
}

SCWindow.prototype.startblock = function (contentstyle){
var s = ""
if(contentstyle){s = contentstyle}
document.write('<div class="scwd1" id="' + this.name + 'container" style="width: ' + this.width + 'px; height: ' + this.height + 'px;">')
document.write('<div class="scwd2" id="' + this.name + 'content2" style="width: ' + this.width + 'px; left: 0pt; top: 0px;">')
document.write('<div class="scwd3" id="' + this.name + 'content" style="width: ' + this.contentwidth + 'px; clip: rect(0pt, 0pt, ' + this.width + 'px, ' + this.height + 'px);' + s + '">')
}

SCWindow.prototype.endblock = function (){
document.write('</div></div></div>')
}

SCWindow.prototype.makecontrols = function (upimage,downimage){
document.write('<div class="scwscrollcontrol" id="' + this.name + 'scroll">')
document.write('<a class="scwbuttons" href="#" onClick="return false" onmouseover="' + this.objname + '.control(\'up\')" onmouseout="' + this.objname + '.stop()">')
if(upimage){document.write('<img src="' + upimage + '" border="0" alt="/\\ ">')}else{document.write('/\\ ')}
document.write('<a class="scwbuttons" href="#" onClick="return false" onmouseover="' + this.objname + '.control(\'down\')" onmouseout="' + this.objname + '.stop()">')
if(downimage){document.write('<img src="' + downimage + '" border="0">')}else{document.write('\\/')}
document.write('</a></div>')
}

SCWindow.prototype.makepagecontrols = function (upimage,downimage){
document.write('<div class="scwpagecontrol" id="' + this.name + 'page">')
document.write('<a class="scwbuttons" href="javascript: ' + this.objname + '.control(\'pgup\')">')
if(upimage){document.write('<img src="' + upimage + '" border="0">')}else{document.write('//\\\\ ')}
document.write('</a><a class="scwbuttons" href="javascript: ' + this.objname + '.control(\'pgdn\')">')
if(downimage){document.write('<img src="' + downimage + '" border="0">')}else{document.write('\\\\//')}
document.write('</a></div>')

}

SCWindow.prototype.makeplaycontrols = function (stopimage,playimage,reverseimage){
document.write('<div class="scwplaycontrol" id="' + this.name + 'play">')
document.write('<a class="scwbuttons" href="javascript: ' + this.objname + '.control(\'reverse\')">')
if(reverseimage){document.write('<img src="' + reverseimage + '" border="0">')}else{document.write('< ')}
document.write('</a><a class="scwbuttons" href="javascript: ' + this.objname + '.stop()">')
if(stopimage){document.write('<img src="' + stopimage + '" border="0">')}else{document.write('0')}
document.write('</a><a class="scwbuttons" href="javascript: ' + this.objname + '.control(\'play\')">')
if(playimage){document.write('<img src="' + playimage + '" border="0">')}else{document.write(' >')}
document.write('</a></div>')

}

So that’s in it’s own little pretty file. Now I have this javascript, which is not in the link rel file, but just stuck in there:

<script type="text/javascript">

</script>

So obviously, because it’s not in the link rel file, it does not get accepted, and is just floating around! So, this is what I need help with: How do I incorporate the code above into the link rel file, and once I have it in that external stylesheet, what goes between the <script type="text/javascript"></script> on my homepage.

OR…
If that’s not a good solution to the problem… How else can I get both scripts working in ONE page?!?

Terribly sorry if this is a amateur problem, unfortunately, I am an amateur

Help would be AMAZING! Please do!

laundromat1967 · #2 (**permalink**) Aug 23rd, 2007, 22:23

Alright. Someone posted after me and has 4 hits already.

My problem is most defintely amatuer.

But, still, Please, Please, Please Help?!

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
external javascript problem	Damian	PHP Forum	0	Dec 5th, 2007 09:44
Conditional IF in external stylesheet	AdRock	Web Page Design	6	Sep 23rd, 2007 22:45
can anyone solve my external php problem?	dilby	PHP Forum	3	Apr 19th, 2007 21:04
external stylesheet doesn't display right	Irvy	Web Page Design	10	Dec 18th, 2006 19:41
Problem with IE, think its external javascript includes	rewind1000	JavaScript Forum	5	Aug 19th, 2005 12:00

		Webforumz.com > Main Forums > Program Your Website > JavaScript Forum
Two javascripts. One page. One external Stylesheet. BIG problem. So amateur.