rss pausing scroller problem

[pcb-beachbum]

Greetings,
I have been using the rss pausing scroller to display some newsfeeds on my website. It works fine..however I have attempted to put the scroller into a table with an id that is used to hide/unhide it by a user click.

when I do this it only works if I have the scroller visible when the page loads.
I would like to have it hidden on load.

Is this a problem that can be solved by changing th JS for the scroller ?

Any suggestions would be appreciated.

You can see the working site at
http://ronbigus.com/

Thanks

[jscheuer1]

No. At least I don't think so. If it is, it would be a more difficult way of dealing with the situation.

Try this out (tested, works in a local mock up) -

Add this highlighted style rule here (on ronbigus.com/index.php, or it's include that produces the on page style code shown, or anywhere that it will be used by the page):

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/basicpage.css" type="text/css" />

<style type="text/css">

.tickertable, .tickertable * {
	visibility: hidden;
	position: absolute;
}

#hintbox{ /*CSS for pop up hint box */
position:absolute;
top: 0; . . .

Add this script or put its function somewhere that's associated with the page:

 . . . yle5 {color: #000000}
.style7 {color: #000000; font-weight: bold; }
</style>

<script type="text/javascript" src="Scripts/helptools.js"></script>
<script type="text/javascript">
function toggle_ticker(){
	var ticker = document.getElementById('ticker');
	ticker.className = ticker.className === 'tickertable'? '' : 'tickertable';
}
</script>
<script type="text/javascript" src="Scripts/calendarDateInput.js"></script>
<style type="text/css">
#ticker td{
margin-left:5px;
}
#pscrolle . . .

Change this section as shown (add/change the highlighted, get rid of the red - scroll the code block to see the red part):

<center class="style5"><a href="#" onclick="toggle_ticker(); return false;">Click here hide/show Real Estate News Ticker</a></center>
<table class="tickertable" width="900" border="2" cellspacing="0" cellpadding="0" align="center" id="ticker" style="visibility:none">
  <tr >
    <th width="300">CNN RE NEWS</th>
    <th width="300" >FOX WALLSTREET</th>
    <th width="300">WSJ Real Estate Ind NEWS</th>

  </tr>
  <tr>
    <td><script type="text/javascript">new rsspausescroller("cnn", "pscroller1", "rssclass", 3000, "_new","date"); </script></td>
    <td><script type="text/javascript">new rsspausescroller("foxrnews", "pscroller3", "rssclass", 3000, "_new", "date");</script></td>
    <td><script type="text/javascript">new rsspausescroller("wallst", "pscroller2", "rssclass", 3000, "_new","date"); </script></td>
  </tr>
</table>

That's it!

Notes: Using display: none; to initially hide something that initially has its dimensions calculated via javascript makes that act impossible. Using visibility: hidden; does not, but it leaves a blank spot. By also setting the position to absolute, we remove the blank spot. Ordinarily this only needs to be done for the container (.tickertable in the updated style/code/markup). But for some reason I needed to include the children (.tickertable, .tickertable *) in this as well to get it to work. I didn't bother finding out why. It works, so no big deal.

[pcb-beachbum]

Thanks for the suggestions.... I tried the changes
you can see the results at http://ronbigus.com/index1.php

as you can see it doesn't quite do what I need. The table gest lost and the position absolute seems to put me at o,o...but only 1 scrollers data is shown and that is without the css being applied.

[jscheuer1]

I was like - "What is this person, nuts or something?" But then I checked in IE 7 (which is on its way out BTW, but still used by a fair number of people). It did exactly what you said. It's fine in all other browsers, including IE 8 and up.

Without harming those, IE 7 and less can be fixed by changing the added style I gave you to:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/basicpage.css" type="text/css" />

<style type="text/css">

.tickertable {
	visibility: hidden;
	position: absolute;
}

.tickertable * {
	visibility: hidden;
}

#hintbox{ /*CSS for pop up hint box */
position:absolute;
top: 0; . . .

And by changing the scripted function for the toggle to:

 . . . yle5 {color: #000000}
.style7 {color: #000000; font-weight: bold; }
</style>

<script type="text/javascript" src="Scripts/helptools.js"></script>
<script type="text/javascript">
function toggle_ticker(){
	var ticker = document.getElementById('ticker'); 
	if(toggle_ticker.ie7 && ticker.className !== 'tickertable'){
		ticker.style.display = 'none';
	}
	ticker.className = ticker.className === 'tickertable'? '' : 'tickertable';
	if(ticker.style.display === 'none'){
		ticker.style.display = '';
	}
}
/*@cc_on @*/
/*@if(@_jscript_version >= 5)
toggle_ticker.ie7 = (function(){
	var ua = /MSIE (\d+)/.exec(navigator.userAgent);
	return ua && ua[1] < 8;
})();
@end @*/
</script>
<script type="text/javascript" src="Scripts/calendarDateInput.js"></script>
<style type="text/css">
#ticker td{
margin-left:5px;
}
#pscrolle . . .

Note: In all others there isn't that brief double image or whatever it is when the scrollers return. The way it was before they all did. Now only IE less than 8 will. If I can figure out how to fix that, I'll let you know.

Edit: I found a way, the above code now reflects it.

[pcb-beachbum]

Wow !!! It Works

Thanks a Million.

Now that you took care of the hard part....there is a little situation in the Middle east...