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 2 of 2
  1. #1
    New Coder
    Join Date
    Oct 2008
    Location
    Kent, WA
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Easy JQuery question.

    Here's my code for the sexy sliding bar, I just want the page to load with it extended (for users with no Javascript).

    Code:
    var isExtended = 0;
    var width = 200;
    var height = "100%";
    var slideDuration = 1000;
    var opacityDuration = 1500;
    function extendContract() {
        if (isExtended == 0) {
            sideBarSlide(0, height, 1, width);
            sideBarOpacity(0, 1);
            isExtended = 1;
            $("#sideBarTab").children().get(0).src = $("#sideBarTab").children().get(0).src.replace(/(\.[^.]+)$/, "-active$1")
        } else {
            sideBarSlide(height, 0, width, 1);
            sideBarOpacity(1, 0);
            isExtended = 0;
            $("#sideBarTab").children().get(0).src = $("#sideBarTab").children().get(0).src.replace(/-active(\.[^.]+)$/, "$1")
        }
    }
    
    
    function sideBarSlide(b, a, c, d) {
        $("sideBarContents").css({
            height: b,
            width: c
        });
        $("#sideBarContents").animate({
            height: a,
            width: d
        },
        {
            queue: false,
            duration: slideDuration
        },
        "linear")
    }
    function sideBarOpacity(b, a) {
        $("#sideBarContents").animate({
            opacity: a
        },
        opacityDuration, "linear")
    }
    $(function() {
        $("#sideBarTab").click(function() {
            extendContract();
            return false
        },
        function() {})
    });
    [

  • #2
    New Coder
    Join Date
    Jan 2008
    Posts
    63
    Thanks
    0
    Thanked 3 Times in 3 Posts
    Just put whatever you want the "default" settings for it to be in your stylesheet - they'll get overridden by the javscript (when it's triggered) but will control the display for people not running javascript.
    Web hosting by coders, for coders: php hosting - Magento eCommerce hosting - perl hosting - check us out!


  •  

    Posting Permissions

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