JQuery slideToggle не работает

Question

My JavaScript:

$("#preview-click").click(function() { 
    $("#preview").slideToggle("fast", function() { 
     $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>'); 
    }); 
}); 

Мой HTML:

<a id="preview-click" style="cursor: pointer;">preview</a> 
<div id="preview" class="generic-block-70" style="display: none"> 
    <div id="preview-pdf" class="generic-content-70"> 
    </div> 
</div> 

Я пытаюсь получить DIV скользить вниз, а затем изменить содержание этого. Если iframe уже находится в div, и я просто slideToggle, кадр не отображается правильно - вот почему мне нужно сгенерировать контент только после того, как div был сделан видимым.

Решение выше просто не работает. Ничего не происходит, когда я нажимаю ссылку.

Следует также отметить, что у меня есть более чем один $(document).ready()

Answer 1

Это прекрасно работает на моем Js скрипку здесь вы используете документ готов http://jsfiddle.net/CyCC3/

$(document).ready(function() { 

$("#preview-click").click(function() { 
    $("#preview").slideToggle("fast", function() { 
     $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>'); 
    }); 
}); 

}); 

Answer 2

$("#preview-click").click(function() { 
    $("#preview").slideToggle("fast", function() { 
     $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>'); 
    }); 
    return false; 
}); 

Answer 3

$("#preview-click").click(function() { 
    $("#preview").slideToggle("fast", function() { 
     $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>'); 
    }); 
    return FALSE; 
}); 

Answer 4

В моем случае, Slidetoggle частично работает в моем iframe, но он оставляет пустое пространство, и я все еще нахожу ответ, как это исправить.

Мои JS

$(document.myform).ready(function() { 
     $('div.demo:eq(0)> div#headerview').click(function() { 
     $(this).next().slideToggle('20'); 
    }); 
    }); 

Мой Html

<div class="demo"> 
<div id="headerview" style="cursor:pointer;">SlideStarts</div> 
    <table> 
     <tr> 
      <td></td> 
     </tr> 
    </table> 
</div> 

Я пытаюсь изменить высоту Iframe, когда слайд вверх и вниз, но по-прежнему выглядит глупо.