Jump to content

Mouseover Scrollpane

Darkwave29

By Darkwave29
in JavaScript

Recommended Posts

Darkwave29 Newbie

Darkwave29

Posted
Posted

I want this scroll pane to be still upon loading the page, however I want the scrolling to initialize on mouseover, and pause when the pointer is off of the scroll pane.The source can be found hereI am still learning css/javascript, but I'd like to complete this script to work properly and I don't know what I am missing.Help would be greatly appreciated, thanks!

Link to comment
Share on other sites
Darkwave29 Newbie

Darkwave29

Posted
  • Author
Posted

For those that are scared of my hyperlink:

<html dir="ltr">	<head>	</head>	<body spellcheck="false">		<p><style type="text/css">#marqueecontainer{position: relative;width: 100%; /*marquee width */height: 260px;overflow: hidden;border: 0px solid orange;padding: 2px;padding-left: 2px;}body,td,th {	font-family: Agency FB;	font-size: 16px;	color: #666666;}body {	background-color: #000000;}</style></p>		<script type="text/javascript">/************************************************ Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)* This notice MUST stay intact for legal use* Visit http://www.dynamicdrive.com/ for this script and 100s more.***********************************************/var delayb4scroll=0 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)var marqueespeed=1 //Specify marquee scroll speed (larger is faster 1-10)var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)?////NO NEED TO EDIT BELOW THIS LINE////////////var copyspeed=marqueespeedvar pausespeed=(pauseit==0)? copyspeed: 0var actualheight=''function scrollmarquee(){if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) //if scroller hasn't reached the end of its heightcross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px" //move scroller upwardselse //else, reset to original positioncross_marquee.style.top=parseInt(marqueeheight)+8+"px"}function initializemarquee(stop){cross_marquee=document.getElementById("vmarquee")cross_marquee.style.top=0marqueeheight=document.getElementById("marqueecontainer").offsetHeightactualheight=cross_marquee.offsetHeight //height of marquee content (much of which is hidden from view)if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exitcross_marquee.style.height=marqueeheight+"px"cross_marquee.style.overflow="scroll"return}setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)}if (document.all)marqueecontainer.stop(true)if (window.addEventListener)window.addEventListener("load", initializemarquee, false)else if (window.attachEvent)window.attachEvent("onload", initializemarquee)else if (document.getElementById)window.onload=initializemarquee</script> <script>if (document.all)scroller.stop()</script>		<div onMouseout="copyspeed=pausespeed" onMouseover="copyspeed=marqueespeed" id="marqueecontainer">		<div style="position: absolute; width: 98%;" id="vmarquee">		<h4>Your scroller contents</h4>		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey<br />		hey hey hey hey hey hey hey hey hey hey hey hey hey hey</div>		</div>	</body></html>

Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted

Well, it seems to be doing just that. I'm not sure if you know though, but the div you have the scrolling text in extends across the width of the page, which is why it only pauses when you move your mouse below the text. Try giving #vmarquee a width that extends only as far as you need it too.edit: upon posting your code, why are you using positioning?

Link to comment
Share on other sites
Darkwave29 Newbie

Darkwave29

Posted
  • Author
Posted
Well, it seems to be doing just that. I'm not sure if you know though, but the div you have the scrolling text in extends across the width of the page, which is why it only pauses when you move your mouse below the text. Try giving #vmarquee a width that extends only as far as you need it too.edit: upon posting your code, why are you using positioning?
I copied and modified this script slightly to blend with my website better. The scrollpane will occupy "100%" of the left navigation frame width (I plan on inserting an image in the right half). I spent a lot of time working on the framesets to accomadate different browsers and display settings (as you can see if you scale your browser window, the frames should adjust and remain proportionate).The scrolling begins at the page load, which is what I don't want.I know my page needs a lot of work and if I have any unnecessary scripting, please let me know. I am very new to this, so please bare with me. I'm just trying to perfect this script:Paused at pageload, scrolls on mouseover, pauses on mouseout ...thats all
Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted

ah, sorry, missed that part. I would try taking out this part:

if (window.addEventListener)window.addEventListener("load", initializemarquee, false)else if (window.attachEvent)window.attachEvent("onload", initializemarquee)else if (document.getElementById)window.onload=initializemarquee

Link to comment
Share on other sites
Darkwave29 Newbie

Darkwave29

Posted
  • Author
Posted
ah, sorry, missed that part. I would try taking out this part:
if (window.addEventListener)window.addEventListener("load", initializemarquee, false)else if (window.attachEvent)window.attachEvent("onload", initializemarquee)else if (document.getElementById)window.onload=initializemarquee

I'm sure that is probably where the problem is located, but if I remove that section entirely, the mouseover/mouseout functions don't work (only displays frozen text on pageload)
Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted

i think I got it. add that code back in, and change this line (right below ////NO NEED TO EDIT BELOW THIS LINE////////////)from

var copyspeed=marqueespeed

to 

var copyspeed=pausespeed

Link to comment
Share on other sites
Darkwave29 Newbie

Darkwave29

Posted
  • Author
Posted
i think I got it. add that code back in, and change this line (right below ////NO NEED TO EDIT BELOW THIS LINE////////////)from
var copyspeed=marqueespeed

to 

var copyspeed=pausespeed

Sir, you are awesome!! Thank you so much...its resolved! =]I'll befriend you on here since I just joined this site.Thank you again!
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...