Solved

i need to start the scroll from left side

Posted on 2009-06-30
8
323 Views
Last Modified: 2012-05-07
i am using the folloing extension in joomla that run test in scroll
what i want is to make the scroll start from left not right as the default here
this is the code attached
<script type="text/javascript">
 

/***********************************************

* Memory Scroller script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

* adaption data http://www.web.renat.sk/  http://www.renat.sk/

***********************************************/
 

var memorywidth="<?php echo $width; ?>" //scroller width

var memoryheight="<?php echo $height; ?>" //scroller height

var memorybgcolor="<?php echo $bgcolor; ?>" //scroller background

var memorypadding="2px" //padding applied to the scroller. 0 for non.

var borderCSS="border: 0px solid black;" //Border CSS, applied to scroller to give border.
 

var memoryspeed="<?php echo $speed; ?>" //Scroller speed (larger is faster 1-10)

var pauseit="<?php echo $pause; ?>" //Pause scroller onMousever (0=no. 1=yes)?
 

var persistlastviewedmsg=1 //should scroller's position persist after users navigate away (1=yes, 0=no)?

var persistmsgbehavior="onload" //set to "onload" or "onclick".
 

//Specify the scroller's content (don't delete <nobr> tag)

//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):
 

var memorycontent='<nobr><span style="font: bold <?php echo $fontsize; ?> Verdana"><?php echo $showtext; ?></span></nobr>'
 
 

////NO NEED TO EDIT BELOW THIS LINE////////////

var combinedcssTable="width:"+(parseInt(memorywidth)+6)+"px;background-color:"+memorybgcolor+";padding:"+memorypadding+";"+borderCSS+";"

var combinedcss="width:"+memorywidth+";height:"+memoryheight+";"
 

var divonclick=(persistlastviewedmsg && persistmsgbehavior=="onclick")? 'onClick="savelastmsg()" ' : ''

memoryspeed=(document.all)? memoryspeed : Math.max(1, memoryspeed-1) //slow speed down by 1 for NS

var copyspeed=memoryspeed

var pausespeed=(pauseit==0)? copyspeed: 0

var iedom=document.all||document.getElementById

if (iedom)

document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;">'+memorycontent+'</span>')

var actualwidth=''

var memoryscroller
 

if (window.addEventListener)

window.addEventListener("load", populatescroller, false)

else if (window.attachEvent)

window.attachEvent("onload", populatescroller)

else if (document.all || document.getElementById)

window.onload=populatescroller
 

function populatescroller(){

memoryscroller=document.getElementById? document.getElementById("memoryscroller") : document.all.memoryscroller

memoryscroller.style.left=parseInt(memorywidth)+8+"px"

if (persistlastviewedmsg && get_cookie("lastscrollerpos")!="")

revivelastmsg()

memoryscroller.innerHTML=memorycontent

actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth

lefttime=setInterval("scrollmarquee()",20)

}
 

function get_cookie(Name) {

var search = Name + "="

var returnvalue = ""

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset)

if (end == -1)

end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}
 

function savelastmsg(){

document.cookie="lastscrollerpos="+memoryscroller.style.left

}
 

function revivelastmsg(){

lastscrollerpos=parseInt(get_cookie("lastscrollerpos"))

memoryscroller.style.left=parseInt(lastscrollerpos)+"px"

}
 

if (persistlastviewedmsg && persistmsgbehavior=="onload")

window.onunload=savelastmsg
 

function scrollmarquee(){

if (parseInt(memoryscroller.style.left)>(actualwidth*(-1)+8))

memoryscroller.style.left=parseInt(memoryscroller.style.left)-copyspeed+"px"

else

memoryscroller.style.left=parseInt(memorywidth)+8+"px"

}
 

if (iedom){

with (document){

document.write('<table border="0" cellspacing="0" cellpadding="0" style="'+combinedcssTable+'"><td>')

write('<div style="position:relative;overflow:hidden;'+combinedcss+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=memoryspeed">')

write('<div id="memoryscroller" style="position:absolute;left:0px;top:0px;" '+divonclick+'></div>')

write('</div>')

document.write('</td></table>')

}

}

</script>

Open in new window

0
Comment
Question by:dr_lionheart
  • 4
  • 4
8 Comments
 
LVL 29

Expert Comment

by:fibo
ID: 24744033
It seems that it happens in
function scrollmarquee(){
if (parseInt(memoryscroller.style.left)>(actualwidth*(-1)+8))
memoryscroller.style.left=parseInt(memoryscroller.style.left)-copyspeed+"px"
else
memoryscroller.style.left=parseInt(memorywidth)+8+"px"
}
-------------------------
and memoryscroller is initialized at lines 50-51
memoryscroller=document.getElementById? document.getElementById("memoryscroller") : document.all.memoryscroller
memoryscroller.style.left=parseInt(memorywidth)+8+"px"
-------------------------------------
I believe that 'memoryscroller.style.left' holds the left margin of the text (see line 98)
So I would test the effect of
function scrollmarquee(){
if( parseInt(memoryscroller.style.left)<8 )
memoryscroller.style.left=parseInt(memoryscroller.style.left)+copyspeed+"px"
else
memoryscroller.style.left=parseInt(actualwidth)-8+"px"
}
0
 
LVL 3

Author Comment

by:dr_lionheart
ID: 24744050
the text now is paused in one position
i need it to run from left to right
instead of right to left
thanks
0
 
LVL 29

Expert Comment

by:fibo
ID: 24744755
OK, here is my revised code.

1 - Test it first as is on your machine, so that if you still have a problem I can procced working on this text.

2 - When it works, you can update your copy from this one:
-- do not copy the first lines, since I have placed constant content instead of the initial php echo
-- do not forget updating revivelastmsg which in some cass was cusing strange things
-- doubly check that all lines ending in with   +"px"   have a real integer before the + . This was the tricky part! use () and parseint in a paranoid way! in "my" vode, most of these have  been edited
<script type="text/javascript">

 

/***********************************************

* Memory Scroller script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

* adaption data http://www.web.renat.sk/  http://www.renat.sk/

***********************************************/

 

var memorywidth="700" //scroller width

var memoryheight="50" //scroller height

var memorybgcolor="#FF0" //scroller background

var memorypadding="2px" //padding applied to the scroller. 0 for non.

var borderCSS="border: 0px solid black;" //Border CSS, applied to scroller to give border.

 

var memoryspeed="2" //Scroller speed (larger is faster 1-10)

var pauseit="1" //Pause scroller onMousever (0=no. 1=yes)?

 

var persistlastviewedmsg=1 //should scroller's position persist after users navigate away (1=yes, 0=no)?

var persistmsgbehavior="onload" //set to "onload" or "onclick".

 

//Specify the scroller's content (don't delete <nobr> tag)

//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

 

var memorycontent='<nobr><span style="font: bold 14px Verdana">This is the test message I am using to test scrolling. It runs over several lines (but a single javascript file). Need to place &lt;br&gt; to force a line break<br>like here.</span></nobr>'

 

 

////NO NEED TO EDIT BELOW THIS LINE////////////

var combinedcssTable="width:"+(parseInt(memorywidth)+6)+"px;background-color:"+memorybgcolor+";padding:"+memorypadding+";"+borderCSS+";"

var combinedcss="width:"+memorywidth+";height:"+memoryheight+";"

 

var divonclick=(persistlastviewedmsg && persistmsgbehavior=="onclick")? 'onClick="savelastmsg()" ' : ''

memoryspeed=(document.all)? memoryspeed : Math.max(1, memoryspeed-1) //slow speed down by 1 for NS

var copyspeed=memoryspeed

var pausespeed=(pauseit==0)? copyspeed: 0

var iedom=document.all||document.getElementById

if (iedom)

document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;">'+memorycontent+'</span>')

var actualwidth=''

var memoryscroller

 

if (window.addEventListener)

window.addEventListener("load", populatescroller, false)

else if (window.attachEvent)

window.attachEvent("onload", populatescroller)

else if (document.all || document.getElementById)

window.onload=populatescroller

 

function populatescroller(){

memoryscroller=document.getElementById? document.getElementById("memoryscroller") : document.all.memoryscroller

memoryscroller.style.left=(parseInt(memorywidth)+8)+"px"

if (persistlastviewedmsg && get_cookie("lastscrollerpos")!="")

revivelastmsg()

memoryscroller.innerHTML=memorycontent

actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth

lefttime=setInterval("scrollmarquee()",20)

}

 

function get_cookie(Name) {

var search = Name + "="

var returnvalue = ""

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset)

if (end == -1)

end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}

 

function savelastmsg(){

document.cookie="lastscrollerpos="+memoryscroller.style.left

}

 

function revivelastmsg(){

lastscrollerpos=parseInt(get_cookie("lastscrollerpos"))

if (lastscrollerpos <0) lastscrollerpos=0

memoryscroller.style.left=lastscrollerpos+"px"

}

 

if (persistlastviewedmsg && persistmsgbehavior=="onload")

window.onunload=savelastmsg
 

function scrollmarquee(){

if( parseInt(memoryscroller.style.left)< (1 + parseInt(memorywidth)) )

memoryscroller.style.left=(parseInt(memoryscroller.style.left)+parseInt(copyspeed))+"px"

else

memoryscroller.style.left="0"

}
 

if (iedom){

with (document){

document.write('<table border="0" cellspacing="0" cellpadding="0" style="'+combinedcssTable+'"><td>')

write('<div style="position:relative;overflow:hidden;'+combinedcss+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=memoryspeed">')

write('<div id="memoryscroller" style="position:absolute;left:0px;top:0px;" '+divonclick+'></div>')

write('</div>')

document.write('</td></table>')

}

}

</script>

Open in new window

0
 
LVL 3

Author Comment

by:dr_lionheart
ID: 24749627
the code now worked great
except for the start of the text it just appear as a whole then start to scroll
check it out here
http://alnajam.net/
thanks again
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 29

Accepted Solution

by:
fibo earned 500 total points
ID: 24751981
OK. I've made a small change which does improve quite a lot. Copy and paste into this "test version" at the right places. If OK, then update your work version. (note line 27 and the changes in the 2 functions)

Note: selecting the "leftmost position" at line 27 is somewhat arbitrary, because there is no way to know the real display width of 'memory content'. I've taken here the option that the display is roughly the same width than the box... but if the text is really more narrow the box would look empty for some time. Or, if it is wider than the box, the box will never look emprty (as is the case with my test text)
If the text you display is delivered from php with no frill, ie no extra html, then you could replace in most places  initialpos with something like (-<?php echo (strlen($showtxt)*10) ?>) assuming the average width character to 10px.


<script type="text/javascript">

 

/***********************************************

* Memory Scroller script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

* adaption data http://www.web.renat.sk/  http://www.renat.sk/

***********************************************/

 

var memorywidth="700" //scroller width

var memoryheight="50" //scroller height

var memorybgcolor="#FF0" //scroller background

var memorypadding="2px" //padding applied to the scroller. 0 for non.

var borderCSS="border: 0px solid black;" //Border CSS, applied to scroller to give border.

 

var memoryspeed="2" //Scroller speed (larger is faster 1-10)

var pauseit="1" //Pause scroller onMousever (0=no. 1=yes)?

 

var persistlastviewedmsg=1 //should scroller's position persist after users navigate away (1=yes, 0=no)?

var persistmsgbehavior="onload" //set to "onload" or "onclick".

 

//Specify the scroller's content (don't delete <nobr> tag)

//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

 

var memorycontent='<nobr><span style="font: bold 14px Verdana">This is the test message I am using to test scrolling. It runs over several lines (but a single javascript file). Need to place &lt;br&gt; to force a line break<br>like here.</span></nobr>'
 

var initialpos=(-parseInt(memorywidth)) // Tune for your need 

 

////NO NEED TO EDIT BELOW THIS LINE////////////

var combinedcssTable="width:"+(parseInt(memorywidth)+6)+"px;background-color:"+memorybgcolor+";padding:"+memorypadding+";"+borderCSS+";"

var combinedcss="width:"+memorywidth+";height:"+memoryheight+";"

 

var divonclick=(persistlastviewedmsg && persistmsgbehavior=="onclick")? 'onClick="savelastmsg()" ' : ''

memoryspeed=(document.all)? memoryspeed : Math.max(1, memoryspeed-1) //slow speed down by 1 for NS

var copyspeed=memoryspeed

var pausespeed=(pauseit==0)? copyspeed: 0

var iedom=document.all||document.getElementById

if (iedom)

document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;">'+memorycontent+'</span>')

var actualwidth=''

var memoryscroller

 

if (window.addEventListener)

window.addEventListener("load", populatescroller, false)

else if (window.attachEvent)

window.attachEvent("onload", populatescroller)

else if (document.all || document.getElementById)

window.onload=populatescroller

 

function populatescroller(){

memoryscroller=document.getElementById? document.getElementById("memoryscroller") : document.all.memoryscroller

memoryscroller.style.left=(parseInt(memorywidth)+8)+"px"

if (persistlastviewedmsg && get_cookie("lastscrollerpos")!="")

revivelastmsg()

memoryscroller.innerHTML=memorycontent

actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth

lefttime=setInterval("scrollmarquee()",20)

}

 

function get_cookie(Name) {

var search = Name + "="

var returnvalue = ""

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset)

if (end == -1)

end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}

 

function savelastmsg(){

document.cookie="lastscrollerpos="+memoryscroller.style.left

}

 

function revivelastmsg(){

lastscrollerpos=parseInt(get_cookie("lastscrollerpos"))

if (lastscrollerpos < initialpos) lastscrollerpos=initialpos

memoryscroller.style.left=lastscrollerpos+"px"

}

 

if (persistlastviewedmsg && persistmsgbehavior=="onload")

window.onunload=savelastmsg
 

function scrollmarquee(){

if( parseInt(memoryscroller.style.left)< (1 + parseInt(memorywidth)) )

memoryscroller.style.left=(parseInt(memoryscroller.style.left)+parseInt(copyspeed))+"px"

else

memoryscroller.style.left=(initialpos)+'px'

}
 

if (iedom){

with (document){

document.write('<table border="0" cellspacing="0" cellpadding="0" style="'+combinedcssTable+'"><td>')

write('<div style="position:relative;overflow:hidden;'+combinedcss+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=memoryspeed">')

write('<div id="memoryscroller" style="position:absolute;left:0px;top:0px;" '+divonclick+'></div>')

write('</div>')

document.write('</td></table>')

}

}

</script>

Open in new window

0
 
LVL 3

Author Comment

by:dr_lionheart
ID: 24752165
thanks alot it worked
0
 
LVL 3

Author Closing Comment

by:dr_lionheart
ID: 31598273
perfect
0
 
LVL 29

Expert Comment

by:fibo
ID: 24752250
B-)) Glad it worked. Thx for the grade and points.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now