Javascript unable to find certain style sheet rules

Discussion in 'Javascript' started by Jake Barnes, Apr 13, 2009.

  1. Jake Barnes

    Jake Barnes Guest

    I have a style sheet with this rule in it:

    li#patterns em, li#apparel em, li#tapes em, li#appliques em,
    li#closures em, li#mend em, li#decor em, li#sewing em, li#quilting em,
    li#ribbon em, li#crochet em, li#kits em, li#products em{
    background: url(Simplicity Home/bg-nav.png) no-repeat;
    cursor: pointer;
    }


    I want to get the background image for this, and for all other rules
    that have background images.


    I have the following code to loop through all the rules of all the
    style sheets:

    var styleSheets = document.styleSheets;
    var stringOfAllStyleRules = "";
    for (var i=0; i < styleSheets.length; i++) {
    var thisStyleSheet = styleSheets;
    if (thisStyleSheet.cssRules) {
    var listOfStyleSheetRules = thisStyleSheet.cssRules;
    }
    if (thisStyleSheet.rules) {
    var listOfStyleSheetRules = thisStyleSheet.rules;
    }

    if (typeof listOfStyleSheetRules == "undefined") {
    window.status = "No style rules could be found";
    } else {
    for (var r=0; r < listOfStyleSheetRules.length; r++) {
    var thisRule = listOfStyleSheetRules[r];
    if (typeof thisRule["style"] != "undefined") {
    var styleObject = thisRule["style"];
    var cssText = thisRule["cssText"];
    var backgroundImageUrl = styleObject["backgroundImage"];
    // if (backgroundImageUrl != "") {
    stringOfAllStyleRules += backgroundImageUrl;
    stringOfAllStyleRules += "<br /> \n";
    stringOfAllStyleRules += cssText;
    stringOfAllStyleRules += "<br /><br /> \n";
    // }
    }
    }
    }
    }
    if (stringOfAllStyleRules) document.getElementById("recently-viewed-
    items").innerHTML = stringOfAllStyleRules;

    The last line is simply so I can see the output on screen. This is how
    the code renders the above rule:

    li#patterns em, li#apparel em, li#tapes em, li#appliques em,
    li#closures em, li#mend em, li#decor em, li#sewing em, li#quilting em,
    li#ribbon em, li#crochet em, li#kits em, li#products em { cursor:
    pointer; }

    The cursor is still there, but the background is gone. Why?

    I'm testing this code on FireFox 3.0.5
     
    Jake Barnes, Apr 13, 2009
    #1
    1. Advertising

  2. Jake Barnes

    RobG Guest

    On Apr 13, 2:09 pm, Jake Barnes <> wrote:
    > I have a style sheet with this rule in it:
    >
    > li#patterns em, li#apparel em, li#tapes em, li#appliques em,
    > li#closures em, li#mend em, li#decor em, li#sewing em, li#quilting em,
    > li#ribbon em, li#crochet em, li#kits em, li#products em{
    >         background: url(Simplicity Home/bg-nav.png) no-repeat;


    Put the URL in quotes.

    --
    Rob
     
    RobG, Apr 13, 2009
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Aaron Prohaska

    Sharing style sheet and javascript file

    Aaron Prohaska, Jan 17, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    327
    Peter Chadwick (MCP)
    Jan 17, 2005
  2. Replies:
    0
    Views:
    531
  3. helveticus

    Unable to cache style sheet

    helveticus, Jul 6, 2008, in forum: ASP .Net
    Replies:
    3
    Views:
    334
    helveticus
    Jul 7, 2008
  4. Replies:
    9
    Views:
    160
    Randy Webb
    Dec 30, 2004
  5. Replies:
    6
    Views:
    158
    murrayatuptowngallery
    Oct 16, 2005
Loading...

Share This Page