Grow your CSS skills. Land your dream job.

Select everything besides certain elements on a page

  • # December 5, 2009 at 9:06 am

    Hi all,

    I want to set the opacity of all elements on the page to .5 except for the navigation and the logo.

    Is there a simple way to do this using jquery.

    Thanks
    Rohan Merchant

    # December 5, 2009 at 8:33 pm

    This is probably best achieved using CSS, unless you’re wanting to do it after the page has already loaded (i.e. when a user clicks something).

    If so, here is some sample code that I’ve just written (untested), based on http://docs.jquery.com/Selectors/all:

    $("*").css("style", "opacity:0.5;filter:alpha(opacity=50)");
    $("h1#logo").css("style", "opacity:1.0;filter:alpha(opacity=100)");
    $("ul#navigation").css("style", "opacity:1.0;filter:alpha(opacity=100)");

    Hope that helps!

    SM

    # December 6, 2009 at 1:24 am

    Nope that doesn’t seem to work at all… is there any way to exclude certain div’s from a selection… like $("body > div") but not div’s with an id of nav

    Thanks

    # December 6, 2009 at 1:36 am

    I got it to work

    Code:
    $(“#nav ul .main #products”).bind( “hover”, { speed:100, delay:100 }, function(){

    $(“body > div[id!=nav_wrapper], #upper_right_nav”).fadeTo(500, .3);

    });

    # December 8, 2009 at 4:18 am

    Even that seems to give me a bunch of problems so I got this plugin for jquery called expose http://flowplayer.org/tools/expose.html which works great.

    If you want to see it in action goto http://www.layersdesignstudio.com/websites/saloon_ro/

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".