jQuery slideToggle не работает - PullRequest
Новая
       2

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

0 голосов
/ 29 декабря 2011

Мой 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, а я просто сдвигаю переключатель, кадр отображается неправильно - поэтому мне нужно генерировать содержимое только после того, как элемент div станет видимым.

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

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

Ответы [ 4 ]

1 голос
/ 20 января 2012

В моем случае 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, когда скользит вверх и вниз, но все еще выглядит глупо.

1 голос
/ 29 декабря 2011 
$("#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; 
});
1 голос
/ 29 декабря 2011 
$("#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;
});
1 голос
/ 29 декабря 2011

Это нормально работает на моей js fiddle. Вы используете готовый документ 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>');
    });
}); 

});
...