CODEWITHSUNDEEP
jquery
nick
nick

Reputation: 376

hiding element but fadeToggle() not working

<script type="text/javascript">
$(document).ready(function() {
    $('#slider').hide();

    $('h3#work').click(function() {
        $('#slider').fadeToggle('slow');
    });
});
</script>

This jQuery code is supposed to toggle a fading in/out box but the the first line with hide() is overriding it!

It works without the hide(), so I must need some sort of conditional. Any tips?

Here is the HTML Code:

<div id="content_slider">

     <div id="slider">            
            <div id="slider_holder"><!-- slider content below-->
        <ul id="slider1"><!-- master holder slider -->

            <li><!-- derm surg-->
            <div id="wrapper_2">

              <div id="video">
              <iframe width="400" height="275" src="http://www.youtube.com/embed/4Ty0dGHpzt8" frameborder="0" allowfullscreen></iframe>
              </div>
              <div id="text">
              <h2><a href="http://www.dermsurgscientific.com">Dermsurg Scientific</a></h2>
              <p>
            Web Developer for Dermsurg Scientific, a medical start-up that has designed and built a new surgical model for doctors to train their facial surgery skills in all types of suturing and tumor removal.

              <br/>
              <br/>

                      I did the design, development and used Magento for our store
                      </p>
              </div>
            </div>
            </li>

Upvotes: 0

Views: 2577

Answers (3)

Luca Borrione
Luca Borrione

Reputation: 16992

Try to use the fadeToggle callback 

<script type="text/javascript">

    $(document).ready(function()
    {
        $('h3#work').click(function()
        {
            $('#slider').fadeToggle('slow', function()
            {
                $('#slider').hide();
            });
        });
    });

</script>

Upvotes: 0

ahmet2106
ahmet2106

Reputation: 5007

Works for me: http://jsfiddle.net/V83kg/

Upvotes: 0

Ansel Santosa
Ansel Santosa

Reputation: 8444

Use $('#slider').fadeOut(0); instead of $('#slider').hide();

Upvotes: 2

Related Questions