Question

我之前有关于simplemodal和iframe How to invoke simplemodal with 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。我怎样才能做到这一点？我不明白Eric的网页上的基本示例。我喜欢我的语法和我只想更改它来调用div而不是iframe和文件。

Answer 1

将<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;
  })

simplemodal direct <div> w / o iframe </div>

1 个答案: