simplemodal direct <div>без встроенного фрейма - PullRequest
Новая
       6

simplemodal direct <div>без встроенного фрейма

0 голосов
/ 15 ноября 2011

У меня есть предыдущий пост относительно simplemodal и iframe Как вызвать simplemodal с помощью onclick inline?

Но теперь я хочу вызвать div, а не файл iframe.

То, что у меня есть, работает очень хорошо, когда simplemodal вызывает iframe: 

 <a href="http://ibm.com" data-width="586" data-height="570" class="ibm_modal">IBM</a>

<script>
    $('.ibm_modal').click(function(e) {
        var hrefval= $(this).attr("href"); 
        var $this = $(this); var height_len = $this.data("height"); 
        var width_len = $this.data("width"); 
        $.modal(
            '<iframe src="' + hrefval + '" height="' +height_len + '" width="' +width_len + '" style="border:none; overflow:auto; margin:0 9px; padding:0; padding-top:10px">', {
           closeHTML:"", 
           overlayCss: {
               backgroundColor:"#000", 
               opacity:85
           },
           containerCss: {
               backgroundColor:"#B9B54F", 
               borderColor:"#B9B54F", 
               border:0, 
               padding:15, 
               height:'height_len+15', 
               width:'width_len+15'
           }, 
           overlayClose: true
        }); 
        e.preventDefault();
    });
</script>

Вместо этого я хочу, чтобы simplemodal вызывал div. Концептуально я этого не понимаю.

Мне кажется, я понимаю, что эту следующую строку нужно удалить и, возможно, заменить на ссылку div, верно? ''

Это нормально? Я не думаю, что это определяет целевой div. Так что dw. 

<a data-width="586" data-height="570" class="ibm_modal">IBM</a>

<div style="display:hidden">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>

Я хочу ссылку, которая при нажатии открывает образец Div выше. Как я могу это сделать? Я не понимаю основной пример на веб-странице Эрика. Мне нравится синтаксис, который у меня есть, и Я просто хочу изменить его, чтобы вызывать div вместо iframe и файла.

1 Ответ

1 голос
/ 15 ноября 2011

Дайте вашему <div> значение id или class, а затем используйте его для селектора jquery.

Пример: 

<div id='myContainer'><p>Lorem ipsum dolor</p></div>


$(".modal").click(function(e) {

    $('#myContainer").modal({

      width: $this.data("width"),
      height: $this.data("height"),
      animate: true,
      opacity: 60
    })
    e.stopPropagation();
    return false;
  })
...