Display content on button click if content is currently hidden...

Discussion in 'jQuery' started by booxcar, Jul 12, 2015.

  1. #1
    Hey guys! First post on these forums! I'm a new web designer with previous programming experience and I am still getting used to the JQuery language... Does anyone see anything obvious with my code below? Basically, I'm trying to make a content window visible based on a navigation button click event but only if the content is currently hidden. I've made it so that on initial launch, the content is hidden.

    $(document).ready(function(){
        $("#navList li").click(function(){
            if ($("#content").css("visibility") == "hidden" == 'none') {
               $("#content").fadeToggle("fast")
            });
        });
    });
    Code (JavaScript):
    Thanks a bunch!
     
    booxcar, Jul 12, 2015 IP
  2. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,623
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #2
    Do you want to hide it again if it is visible? Seems that way, since you're using fade Togolese. Why don't you hide it with javascript (that way it will be visible for the users with javascript turned off), and just use toggle when the button / list item is clicked?
    Or, if you just want to show it, not hide it again, use hide() to hide it with javascript and show() on the click (it won't do anything if the content is already visible).
     
    PoPSiCLe, Jul 12, 2015 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    1) why are you trapping clicks on LI, are you just TRYING to make sure the page is an accessibility failure? (should be trapping anchors)

    2) why would you be hiding CONTENT?!?

    3) I'd have to see the page, but in modern browsers are you sure you even need scripting much less the dumbass bloated train wreck of asshattery known as jQuery for this, and couldn't simply leverage :target (with it always showing in pre CSS3 browsers)?

    If you're just starting out, some advice: Skip the scripttardery for now, particularly goofy show/hide crap that just makes sites harder to use... most so the bloated train wreck of developer ineptitude known as jQuery.
     
    deathshadow, Jul 12, 2015 IP