Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Senior Coder
    Join Date
    Jul 2003
    Location
    My pimped-out igloo in Canadia
    Posts
    1,966
    Thanks
    36
    Thanked 0 Times in 0 Posts

    disabling code if more than one 'space'

    Hey.

    I've been working on this script (and i got it to do what i need). it allows me to fade in an underline.

    My question is whether it is possible to add in a line within the script telling it that "If there is more that one 'space', dont underline until the start of the next character" ?

    maybe using something like value.replace(/\s/g,'')

    i ask only because within the page i am using it on sometimes i have a link that spans two lines (because the area it is in is small, width wise). When this occurs the underline looks odd because it spans a bunch of spaces that have no text in them. For example: Scaletron --> RadarTron ...

    have a look here:
    www.enviromark.ca/english/Products_fade.htm

    also, i noticed that when the mouse goes from one link to the other, the fadeOut is cancelled on the first link... sorta rendering the variable "stepOut" useless. any ideas on how to make the fadeOut aspect of the script last on the previous link even when the mouse is over a new link?

    here's the script. The script below is a standalone version of the script used on the page. the one on the link above has been modified to work with another script on the page. it may be worth it to look at the source of the link above
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title></title>
    <style type="text/css">
    body {
    background-color: #fff;
    }
    #description a {
    text-decoration: none;
    color: #33f;
    }
    </style>
    <script type="text/javascript"><!--
    startColor = "#FFFFFF"; // MouseOut link color 
    endColor = "#FFB903"; // MouseOver link color 
    
    stepIn = 22; // delay when fading in 
    stepOut = 22; // delay when fading out 
    
    hexa = new makearray(16); 
    for(var i = 0; i < 10; i++) 
    hexa[i] = i; 
    hexa[10]="a"; hexa[11]="b"; hexa[12]="c"; 
    hexa[13]="d"; hexa[14]="e"; hexa[15]="f"; 
    
    
    window.onload = function() {
      if(!document.all || !document.getElementsByTagName) return;
      var links = document.getElementById('description').getElementsByTagName('A');
      for(var i=0;i<links.length;i++){
        links[i].onmouseover = domouseover;
        links[i].onmouseout = domouseout;
      }
    }
    
    startColor = dehexize(startColor.toLowerCase()); 
    endColor = dehexize(endColor.toLowerCase()); 
    
    var fadeId = new Array(); 
    
    function dehexize(Color){ 
    var colorArr = new makearray(3); 
    for (i=1; i<7; i++){ 
    for (j=0; j<16; j++){ 
    if (Color.charAt(i) == hexa[j]){ 
    if (i%2 !=0) 
    colorArr[Math.floor((i-1)/2)]=eval(j)*16; 
    else 
    colorArr[Math.floor((i-1)/2)]+=eval(j); 
    } 
    } 
    } 
    return colorArr; 
    } 
    
    function domouseover() { 
    if(window.event){
      var El = event.srcElement;
    } else return;
    if (El.tagName.toUpperCase() == "A")
      fade(startColor,endColor,El.uniqueID,stepIn);
    } 
    
    function domouseout() { 
    if(window.event){
      var El = event.srcElement;
    } else return;
    if (El.tagName.toUpperCase() == "A")
      fade(endColor,startColor,El.uniqueID,stepOut); 
    } 
    
    function makearray(n) { 
    this.length = n; 
    for(var i = 1; i <= n; i++) 
    this[i] = 0; 
    return this; 
    } 
    
    function hex(i) { 
    if (i < 0) 
    return "00"; 
    else if (i > 255) 
    return "ff"; 
    else 
    return "" + hexa[Math.floor(i/16)] + hexa[i%16];} 
    
    function setColor(r, g, b, element) { 
    var hr = hex(r); var hg = hex(g); var hb = hex(b); 
    //element.style.color = "#"+hr+hg+hb;
    element.style.borderBottom = "1px solid #"+hr+hg+hb;
    } 
    
    function fade(s,e, element,step){ 
    var sr = s[0]; var sg = s[1]; var sb = s[2]; 
    var er = e[0]; var eg = e[1]; var eb = e[2]; 
    
    if (fadeId[0] != null && fade[0] != element){ 
    setColor(sr,sg,sb,eval(fadeId[0])); 
    var i = 1; 
    while(i < fadeId.length){ 
    clearTimeout(fadeId[i]); 
    i++; 
    } 
    } 
    
    for(var i = 0; i <= step; i++) { 
    fadeId[i+1] = setTimeout("setColor(Math.floor(" +sr+ " *(( " +step+ " - " +i+ " )/ " +step+ " ) + " +er+ " * (" +i+ "/" + 
    step+ ")),Math.floor(" +sg+ " * (( " +step+ " - " +i+ " )/ " +step+ " ) + " +eg+ " * (" +i+ "/" +step+ 
    ")),Math.floor(" +sb+ " * ((" +step+ "-" +i+ ")/" +step+ ") + " +eb+ " * (" +i+ "/" +step+ ")),"+element+");",i*step); 
    } 
    fadeId[0] = element; 
    }
    // -->
    </script>
    </head>
    <body>
    <p><a href="#" class="normal">test link</a></p>
    <p id="description"><a href="#">test link</a> <a href="#">test link X</a></p>
    <p><a href="#" class="fade">test link</a></p>
    
    </body>
    </html>
    Before you criticize someone, you should walk a mile in their shoes. That way, when you criticize them, you're a mile away and you have their shoes :)

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,298
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    value.replace(/\s+/g,' ')
    replaces multiple (more than one) spaces with just one single space.

  • #3
    Senior Coder
    Join Date
    Jul 2003
    Location
    My pimped-out igloo in Canadia
    Posts
    1,966
    Thanks
    36
    Thanked 0 Times in 0 Posts
    okay, can that be applied to this script? from the sounds of it it wont do what i need it to.

    okay, lets break the problem down.
    step 1: How would i get the script to check for multiple, consecutive spaces?
    Before you criticize someone, you should walk a mile in their shoes. That way, when you criticize them, you're a mile away and you have their shoes :)

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,298
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    if (/\s{2,}/g.test(value)) {
    alert ("You have entered two or more consecutive spaces");
    }

  • #5
    Senior Coder
    Join Date
    Jul 2003
    Location
    My pimped-out igloo in Canadia
    Posts
    1,966
    Thanks
    36
    Thanked 0 Times in 0 Posts
    I like the approach.

    right now the way my script works is it is only activated on links within a certain div. can i use that code (or similar) to scan the link that the code is working on, and if there are two consecutive spaces within the text of the link, disable the code until the next character.

    something tells me that made no sense. let me do it graphically¨
    [code]
    right now i have this situation
    Here's the first line of a link_
    _-_Here's the second


    I would like this situation
    Here's the first line of a link
    - Here's the second
    [\code]
    Before you criticize someone, you should walk a mile in their shoes. That way, when you criticize them, you're a mile away and you have their shoes :)

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,298
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    Perhaps I have not understood the problem, but what is wrong with

    <a href = "whatever.html" >First line of link<br>Second line of link</a>

  • #7
    Senior Coder
    Join Date
    Feb 2004
    Location
    Edinburgh
    Posts
    1,352
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M
    Perhaps I have not understood the problem, but what is wrong with

    <a href = "whatever.html" >First line of link<br>Second line of link</a>

    you can't have spaces in your tag above. it won't validate and will likely break in some, if not most, if not all, browsers.
    *keep it simple (TM)

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,298
    Thanks
    203
    Thanked 2,561 Times in 2,539 Posts
    Quote Originally Posted by jbot
    you can't have spaces in your tag above. it won't validate and will likely break in some, if not most, if not all, browsers.
    I bow to your superior expertise, but I have to say that it works
    just fine in IE5.5. Possibly not in other browsers as you say.

  • #9
    Senior Coder
    Join Date
    Jul 2003
    Location
    My pimped-out igloo in Canadia
    Posts
    1,966
    Thanks
    36
    Thanked 0 Times in 0 Posts
    jbot

    can you see a way around my problem above them?
    Before you criticize someone, you should walk a mile in their shoes. That way, when you criticize them, you're a mile away and you have their shoes :)

  • #10
    Senior Coder
    Join Date
    Jul 2003
    Location
    My pimped-out igloo in Canadia
    Posts
    1,966
    Thanks
    36
    Thanked 0 Times in 0 Posts
    jbot

    can you see a way around my problem above them? my original posts' problem
    Before you criticize someone, you should walk a mile in their shoes. That way, when you criticize them, you're a mile away and you have their shoes :)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •