Fading Scroller Script jumping in NS/FF

[dalamar17]

Hello,

I am having an issue with the fading scroller script I got here:
http://www.dynamicdrive.com/dynamici...fadescroll.htm

I have implemented it on this page:
http://www.corporatesearchers.com/temp/

and in NS7 FF 1 (fine in IE) it causes the rest of the page to jump when the paragraphs aren't of the same length in the scroller.

Thanks

Jeff

[jscheuer1]

You haven't allowed enough height in the table cell for the fading scroller under Mozilla (FF and NS). Where you have:

 . . .
	   <table width="180" border="0" align="center" cellpadding="0" cellspacing="0">
       		 <tr>
          	<td height="160" colspan="2" align="left" valign="top">
      <!-- InstanceBeginEditable name="news" -->
<script type="text/javascript">

/***********************************************
* Fading Scroller- © 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
***********************************************/
 . . .

The height in red is too short to accommodate it. I found that 172 worked well, to be on the safe side, use 180. This will push the graphic 'images/advertise.gif' down a bit but, fortunately there is room for adjustment just above that:

 . . .
</script>
       <!-- InstanceEndEditable -->
	  		</td>
       		</tr>
       		 <tr>
       		   <td colspan="2" align="left" valign="top"><p>&nbsp;</p>
   		       <p>&nbsp;</p></td>
	     </tr>
       		 <tr>
       		   <td colspan="2" align="center" valign="top"><img src="images/advertise.gif" alt="Advertise with CENTRO - Call 1.877.239.6616" width="103" height="145"></td>
 . . .

You can eliminate one or both (at your discretion) of the empty paragraphs above, highlighted red.

[dalamar17]

Thanks - I got that set straight now if I could only figure out how to make the text start at the same vertical position as the text in the middle of the page (under the Corporate Specialists heading) it would be perfect.

Jeff

[jscheuer1]

For that, first you need to be consistent in the individual content. The first two begin with <p> the last does not. This seems to only make a difference in Mozilla. I vote for removing all opening <p>'s from the fcontent[x] entries. Then you can go to the paragraph above the containing table for the script and set its bottom margin accordingly, ending up with something like this:

<p class="blue-title" style="margin-bottom:8px!important;margin-bottom:9px;"><img src="images/spacer.gif" width="190" height="2"><br>
      News &amp; Announcements</p>
	   <table width="180" border="0" align="center" cellpadding="0" cellspacing="0">
       		 <tr>
          	<td height="180" colspan="2" align="left" valign="top">
      <!-- InstanceBeginEditable name="news" -->

<script type="text/javascript">

/***********************************************
* Fading Scroller- © 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
***********************************************/

var delay = 4000; //set delay between message change (in miliseconds)
var maxsteps=30; // number of steps to take to change from start color to endcolor
var stepdelay=40; // time in miliseconds of a single step
//**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
var startcolor= new Array(255,255,255); // start color (red, green, blue)
var endcolor=new Array(0,0,0); // end color (red, green, blue)

var fcontent=new Array();
begintag='<div class="bluelinks" style="font: normal 11px Verdana; color: #1D7DA5; padding: 0px;">'; //set opening tag, such as font declarations
fcontent[0]="Visit our <a class='bluelinks' href='news.html'>News</a> section for current updates from the Ontario Ministry of Government Services <p>NEW - Order all your <a class='bluelinks' href='due-diligence-order.html'>Due Diligence searches</a> on one easy form!</p>";
fcontent[1]="NEW - <a class='bluelinks' href='business-resources.html'>Electronic PPSA Registration</a> requisition<p>Robert Borrelli, Manager, wins the <a class='bluelinks' href='news.html'>Samsung Race for the Torch contest</a>!</p>";
fcontent[2]="Centro Legal Works sponsors the <a class='bluelinks' href='news.html'>Goodman and Carr Foundation Golf Tournament</a>";
closetag='</div>';

[dalamar17]

schpank you
schpank you very much John!