• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 331
  • Last Modified:

JavaScript - Marquee Problem

Now its starting from the beginning of the text on every page redirection is there a way to continue to next page where it left on the previous page....??

<MARQUEE scrollAmount=4 direction="left">
Hi
this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
0
Rajar Ahmed
Asked:
Rajar Ahmed
  • 9
  • 8
  • 5
  • +1
7 Solutions
 
anvCommented:
you should make use of frames.
http://www.w3schools.com/tags/tag_frameset.asp

Keep the Marquee in a separate frame and all the pages that load in another frame of a main page.
0
 
Gurvinder Pal SinghCommented:
@meeran03: I don't think there is straightforward way of starting the marquee from the middle of the text (left over from the previous page after navigation).
But you can try following.
1) Find out how much text has passed through, and submit that details to the new page.
2) make the marquee on the new page invisible, till the same amount of text has passed through (by speeding up the marquee),
3) after that much amount of text has passed through, you can make the marquee visible and normalize the speed.

THanks
0
 
Rajar AhmedConsultantAuthor Commented:
hi any ,

srry i cant use frames as it leads to lot of changes in the project...!

hi gurvinder .

Even i thought something like that , but i havent had my hand on code in marquee ..so bit strange how to do this ...
?can u present a small eg ... will be more helpfull

Thanks
Meeran 03 :)
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
Michel PlungjanIT ExpertCommented:
Gurvinder, no need to speed it up, if you can figure out how much of the text that has passed, chop that off and stick it onto the end of the string in the marquee
0
 
Gurvinder Pal SinghCommented:
@mplungjan: yes, that can also be tried.

@meeran03: Based on the marquee speed that you have set, and the time since the when the page has been loaded, you need to find out how many chars have passed through.

you can fetch the marquee speed by
var scrollAmount = document.getElementById('Marque1').scrollamount ;

you can fetch the time elapsed by
var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;

you can fetch the amount of text scrolled passed,

var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;

send this value to the next page, so that that much text be detached from the front and appended at the back.

Thanks
0
 
Rajar AhmedConsultantAuthor Commented:
i tried like this .. created two html page ... onclick i get the value of textpassed  with ur js ..
but am getting  pageLoadTime is undefined error ..is am on right path ??



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script language="javascript">
//you can fetch the marquee speed by
function text()
{
var scrollAmount = document.getElementById('Marque1').scrollamount ;
//you can fetch the time elapsed by
var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
//you can fetch the amount of text scrolled passed,
var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;
alert(textLengthScrolled);
}
</script>
</head>

<body>
Test 2 PAge 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="test1.html" onclick="return text()">Marquee Text</a>
</body>
</html>

Second page 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script>
//you can fetch the marquee speed by
function text()
{
var scrollAmount = document.getElementById('Marque1').scrollamount ;
//you can fetch the time elapsed by
var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
//you can fetch the amount of text scrolled passed,
var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;
alert(textLengthScrolled);
}
</script>
</head>


<body>
Hi this Test1 Page
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="test2.html" onclick="return text()">Marquee Text</a>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
window.onload=function() {
  var text = document.getElementById('Marque1").innerHTML;
  var from = location.search.substring(1)
  var part1 = text.substring(from);
  var part2 = text.substring(0,from);
  document.getElementById('Marque1").innerHTML=part1+part2;
}

and do this in page1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script language="javascript">
//you can fetch the marquee speed by
function text()
{
var scrollAmount = document.getElementById('Marque1').scrollamount ;
//you can fetch the time elapsed by
var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
//you can fetch the amount of text scrolled passed,
var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;
return textLengthScrolled;
}
</script>
</head>

<body>
Test 2 PAge 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="test1.html" onclick="this.href='test1.html?'+text()">Marquee Text</a>
</body>
</html>

Open in new window

0
 
Rajar AhmedConsultantAuthor Commented:
Hi mplungjan,

i still get the  pageLoadTime is undefined error ..
and am not getting that string if i checked in alert box also ,

And again the page 2 is starting from the begining .

Thanks
<input id="gwProxy" type="hidden"><!--Session data--><input onclick="jsCall();" id="jsProxy" type="hidden">
Page 1 : 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script language="javascript">
//you can fetch the marquee speed by
function text()
{
var scrollAmount = document.getElementById('Marque1').scrollamount ;
//you can fetch the time elapsed by
var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
//you can fetch the amount of text scrolled passed,
var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;
alert(textLengthScrolled);
return textLengthScrolled;
}
</script>
</head>

<body>
Test 2 PAge 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="test1.html" onclick="this.href='test1.html?'+text()">Marquee Text</a>
</body>
</html>

Page 2 : 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script>
function hi() 
{
 var text = document.getElementById('Marque1').innerHTML;
 var from = location.search.substring(1)
 var part1 = text.substring(from);
 var part2 = text.substring(0,from);
 document.getElementById('Marque1').innerHTML=part1+part2;
}
</script>
</head>

<body onload="return hi()">
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
youneed to do a
var pageLoadTime=new Date()
0
 
Rajar AhmedConsultantAuthor Commented:
This is always returning zero ??
((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;

so unable to find text length scrolled ..

0
 
Gurvinder Pal SinghCommented:
pageLoadTime = new Date(); should be done at the page load time, and you should make sure that this variable is not updated again later.
make it a global variable, but initialize it only in the onload event on the body and never again

0
 
Michel PlungjanIT ExpertCommented:
As in (not tested)

<script language="javascript">
var pageLoadTime = new Date(); // in case someone clicks before finished loading

//you can fetch the marquee speed by
function text() {
  var scrollAmount = document.getElementById('Marque1').scrollamount ;
  //you can fetch the time elapsed by
  var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
  //you can fetch the amount of text scrolled passed,
  var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % marqueeText.length;
  return textLengthScrolled;
}
window.onload=function() {
  pageLoadTime = new Date(); // this is what we need later
}
</script>

Open in new window

0
 
Rajar AhmedConsultantAuthor Commented:
on alert(textLengthScrolled); during testing
i get NAN as result why it so ??

<script language="javascript">
var pageLoadTime = new Date(); // in case someone clicks before finished loading

//you can fetch the marquee speed by
function text() {
  var scrollAmount = document.getElementById('Marque1').scrollAmount ;
  //you can fetch the time elapsed by
  var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
  //you can fetch the amount of text scrolled passed,
  var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % Marque1.length;
  alert(textLengthScrolled);
  return textLengthScrolled;
}
window.onload=function() {
  pageLoadTime = new Date(); // this is what we need later
}
</script>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
Marque1.innerHTML.length;

0
 
Rajar AhmedConsultantAuthor Commented:
hi mplunjian ,

oopss......i want to continue from where it left .. this is removing all the character which scrolled in previous page.....i understand d difficulty of this task ...
but we require like that . !
0
 
Gurvinder Pal SinghCommented:
"this is removing all the character which scrolled in previous page"
You have to remove those characters from the front and paste it at the back of that text.

Something like
function cycleChars(text, numberOfChars)
{
   var tmpText1 = text.substring(0,numberOfChars);
   var tmpText2 = text.substring(numberOfChars);
   var text= tmpText2 + tmpText1 ;
}

0
 
Michel PlungjanIT ExpertCommented:
Yes something like this:


<script language="javascript">
var pageLoadTime = new Date(); // in case someone clicks before finished loading

//you can fetch the marquee speed by
function text() {
  var Marque1 = document.getElementById('Marque1');
  var text = Marque1.innerHTML
  var scrollAmount = Marque1.scrollAmount ;
  //you can fetch the time elapsed by
  var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
  //you can fetch the amount of text scrolled passed,
  var textLengthScrolled = ( scrollAmount *  timeElapsedInSeconds ) % text.length;
  alert(textLengthScrolled);
  return textLengthScrolled;
}
window.onload=function() {
  pageLoadTime = new Date(); // this is what we need later
  var text = document.getElementById('Marque1").innerHTML;
  var from = location.search.substring(1)
  var part1 = text.substring(from);
  var part2 = text.substring(0,from);
  document.getElementById('Marque1").innerHTML=part1+part2;
}

</script>

Open in new window

0
 
Rajar AhmedConsultantAuthor Commented:
this code .is doing but ..


marquee starts from here ...:( but requirement is not like that...!!
i agree the coding is such a way done .. i stick to my marquee text in the question posted.

Combined both the experts code ......
 var from = location.search.substring(1)
if  from =3
//
var part_real= cycleChars(text, from) (In code )
result is
his Text should be continued where it left from the page on redirection . But now Starting from beginning . How can i do this ??Hi t


but all i need is ...
this should be already opened and then it should get scrolled after this ...
Hi this get marquee like this ... i agree the coding is such a way done .. but all i need is ...
his Text should be continued where it left from the page on redirection . But now Starting from beginning . How can i do this ??


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script>
function hi() 
{
 pageLoadTime = new Date(); // this is what we need later
  var text = document.getElementById('Marque1').innerHTML;
  var from = location.search.substring(1)
  var part1 = text.substring(from);
  var part2 = text.substring(0,from);
  var part_real= cycleChars(text, from)
document.getElementById('Marque1').innerHTML=part_real;
}

function cycleChars(text, numberOfChars)
{
   var tmpText1 = text.substring(0,numberOfChars);
   var tmpText2 = text.substring(numberOfChars);
   var text= tmpText2+tmpText1;
   return text;
}
</script>
</head>

<body onload="return hi();">
Test 2 PAge 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="marquee_text.html" onclick="return text()">Marquee Text</a>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
This

var part1 = text.substring(from);
  var part2 = text.substring(0,from);
  var part_real= cycleChars(text, from)


and this

var tmpText1 = text.substring(0,numberOfChars);
   var tmpText2 = text.substring(numberOfChars);
   var text= tmpText2+tmpText1;


is identical
0
 
Rajar AhmedConsultantAuthor Commented:
hi mplungjan,

welll its okayy ...

is it possible to do wat am asking ??
0
 
Michel PlungjanIT ExpertCommented:
Here - and my name is mplungjan

Page 1

<html>
<head>
<script language="javascript">
var pageLoadTime = new Date(); // in case someone clicks before finished loading

//you can fetch the marquee speed by
function getText() {
  var Marque1 = document.getElementById('Marque1');
  var text = Marque1.innerHTML
  var scrollAmount = Marque1.scrollAmount ;
  //you can fetch the time elapsed by
  var timeElapsedInSeconds = ((new Date()).getMilliseconds() - pageLoadTime.getMilliseconds())/60;
  //you can fetch the amount of text scrolled passed,
  var textLengthScrolled = parseInt (( scrollAmount *  timeElapsedInSeconds ) % text.length);
  return textLengthScrolled;
}
window.onload=function() {
  pageLoadTime = new Date(); // this is what we need later
}

</script>

</head>

<body>
Test 1 Page 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 <a href="marquee2.html" onclick="this.href='marquee2.html?'+getText()">Marquee Text</a>
</body>
</html>


page2

<html>
<head>
<script language="javascript">

window.onload=function() {
  var text = document.getElementById("Marque1").innerHTML;
  var from = location.search.substring(1)
  var part1 = text.substring(from);
  var part2 = text.substring(0,from);
  document.getElementById("Marque1").innerHTML=part1+part2;
}

</script>

</head>

<body>
Test 2 Page 
<MARQUEE scrollAmount=4 id="Marque1" direction="left">
Hi this Text should be continued where it left from the page on
redirection . But now Starting from beginning . How can i do this ??
</MARQUEE>
 </body>
</html>

Open in new window

0
 
Rajar AhmedConsultantAuthor Commented:
hi mplungjan,
my apologies for calling ur name wrongly

Meeran03
0
 
Gurvinder Pal SinghCommented:
@meeran03: Thanks for the points. Could you please post the solution/source code which has resolved your problem.

Thanks again
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 9
  • 8
  • 5
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now