2013-03-29 1 views
3

Я очень нуб для jquery и все об этом. Я делаю только одну страницу ad hoc, поэтому я заблудился. Мне нужно отображать iframe as и popup. Как это сделать?bpopup не работает + отображение на странице load

Я попытался bpopup:

index.html, как:

<button id="my-button">POP IT UP</button> 
<!-- Element to pop up --> 
<div id="element_to_pop_up"> 
    <a class="b-close">x<a/> 
    Content of popup 
</div> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="js/jquery.bpopup.min.js"></script> 
<script src="js/jquery.easing.1.3.js"></script> 
<script src="js/scripting.min.js"></script> 

И в соответствии с домашней страницы bpopup я модифицирована jquery.bpopup.min.js

// Semicolon (;) to ensure closing of earlier scripting 
// Encapsulation 
// $ is assigned to jQuery 
;(function($) { 

    // DOM Ready 
    $(function() { 

     // Binding a click event 
     // From jQuery v.1.7.0 use .on() instead of .bind() 
     $('#my-button').bind('click', function(e) { 

      // Prevents the default action to be triggered. 
      e.preventDefault(); 

      // Triggering bPopup when click event is fired 
      $('element_to_pop_up').bPopup({ 
     content:'iframe', //'ajax', 'iframe' or 'image' 
     contentContainer:'.content', 
     loadUrl:'http://dinbror.dk/search' //Uses jQuery.load() 
    }); 


     }); 

    }); 

})(jQuery); 

и я настройка по умолчанию CSS:

#element_to_pop_up { 
    background-color:#fff; 
    border-radius:15px; 
    color:#000; 
    display:none; 
    padding:20px; 
    min-width:400px; 
    min-height: 180px; 
} 
.b-close{ 
    cursor:pointer; 
    position:absolute; 
    right:10px; 
    top:5px; 
} 

Теперь странная вещь. Существует установленный по умолчанию параметр js, такой как $('#element_to_pop_up').bPopup();, который фактически работает, после всплывающих окон появляются простые всплывающие окна. Но когда я использую настройку Iframe (как указано выше), ничего не происходит. Ничего. Whyyyy? Я так смущен этим.

Цель - отобразить всплывающее окно при загрузке страницы. Я видел несколько намеков, но никто из них не работает. Какой файл изменить и как ????

Если вы знаете, как помочь, пожалуйста, скажите мне. Просто не забывайте, что я как маленький ребенок, который учится ходить. Поэтому не пропустите ни одной детали, как «шнурки для шнурки». Спасибо больше, чем много.

ответ

-1

Есть пара вещей, которые нужно проверить. Сначала откройте Chrome Dev Tools и посмотрите консоль. Посмотрите, получаете ли вы какие-либо ошибки при нажатии на кнопку.

Во-вторых, проверьте вкладку «Сеть» и убедитесь, что все правильно загружается.

Можете ли вы опубликовать код, который действительно работает, чтобы мы могли видеть, что другое?

0
<div id="element_to_pop_up"> 
<a class="b-close">x<a/> 

<div class="content"> 
    Content of popup 
</div> 

</div> 

просто добавьте дополнительный div с классом «содержание». Он должен работать.

5

Хорошо. Я знаю ответ на этот вопрос. Проблема в том, что вы скопировали и вставили свой код со своего сайта, и на нем что-то не так.

Посмотрите внимательно на идентификатор элемента в этой строке:

$('element_to_pop_up').bPopup({..... 

ОНИ НЕ ПОМЕСТИТЕ # перед element_to_pop_up. Его должно быть

$('#element_to_pop_up').bPopup({..... 

после этого ваш код должен работать

0

Попробуйте добавить «JQuery-1.10.2.js» библиотеку на вашу страницу или последнюю версию.