spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / dhtml / column27
Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

Logo

Dynamic Headline Fader, Version 3.0
IEmac 4.0 vertical spacing


The Problem

When we display more than one headline, the headlines do not get vertical spacing between them, even though each headline is enclosed in a paragraph tag.

To illustrate this, let's hard-code a Fader with in-line styling:

<DIV ID="elFader"
     STYLE="position:absolute;width:122;height:100;padding:5;
     font-family:sans-serif;font-size:12pt;font-weight:bold;
     border:4px maroon solid;background:white;
     text-align:center;line-height:12pt">
        <P>The Dynamic Headline Fader is Back!</P>
        <P>This time it can swim, too!</P>
</DIV>

The above displays in IEmac 4.0 as:

Does IEmac 4.0 not understand even the paragraph tag? Doesn't it know that one line of vertical spacing is standard rendering between paragraphs?

Of course it does. What it also does is override paragraph spacing when a line-height is specified! Inter-paragraph spacing is given the same value as inter-line spacing! This behavior was fixed with IEmac 4.01.

The Solution

Since we cannot avoid using line height (it is one of our parameter variables - FDRlinHgt), we must force an extra line break between items. This is easily accomplished by conditionally adding a <BR> after every headline:

function FDRmakeStr(){
  tempStr = "";
  for (i=0;i<FDRhdlineCount;i++){
    if(newsCount>=arNews.length) break;
    dispStr = arNews[newsCount];
    linkStr = arNews[newsCount+1];
    isLink = linkStr.length;
    if (isLink) {
      tempStr += "<P><A CLASS=newslink "
              + "HREF='" + prefix + linkStr + "'>"
              + dispStr + "</A></P>"
    }
    else {
      tempStr +=
        ((NS4) ? "<P CLASS=nolink>" : "<P>") +dispStr+"</P>";
    }
    if(IE40mac) tempStr +="<BR>";
    newsCount += 2;
  }
  return tempStr;
}

To illustrate the change, we can modify our hard-coded example to read:

<DIV ID="elFader"
     STYLE="position:absolute;width:122;height:100;padding:5;
     font-family:sans-serif;font-size:12pt;font-weight:bold;
     border:4px maroon solid;background:white;
     text-align:center;line-height:12pt">
        <P>The Dynamic Headline Fader is Back!</P>
        <BR>
        <P>This time it can swim, too!</P>
</DIV>

Which gives us this, correct, display in IEmac 4.0:

IEmac 4.0 still has one more problem with our script that we must overcome.


Produced by Peter Belesis and

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint

All Rights Reserved. Legal Notices.
Created: Nov 30, 1999
Revised: Nov 30, 1999

URL: http://www.webreference.com/dhtml/column27/fade3iemaclineht.html