灯箱开放html

我想使用lightbox打开一个窗体，窗体本身是另一个页面中使用的html。灯箱开放html

问题是我试过ShadowBox，它打开一个iframe，我的大部分变量在这个过程中都丢失了。我试过Lightbox5，我似乎无法找到代码传入一个HTML。

有什么建议吗？

我做了这样的事情与太极拳

<a rel="shadowbox[MyStuff]" href="survey.html">survey</a>

它将解析了在元素传递是一个HTML，但它会在iframe打开从而失去了变数，我有这个页面

加入整个样本代码

<html> 

<head> 
    <!-- the shadowbox stylesheet and js --> 
    <link rel="stylesheet" type="text/css" href="jquery.lightbox-0.5.css" 
    media="screen" /> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery.lightbox-0.5.js"></script> 
    <script type="text/javascript"> 
     $(document) 
      .ready(function() 
     { 
      // Use this example, or... 
      $('a[@rel*=lightbox]') 
       .lightBox(); // Select all links that contains lightbox in the attribute rel 
      // This, or... 
      $('#gallery a') 
       .lightBox(); // Select all links in object with gallery ID 
      $('#somehiddendiv div') 
       .lightBox(); // Select all links in object with gallery ID 
      // This, or... 
      $('a.lightbox') 
       .lightBox(); // Select all links with lightbox class 
      // This, or... 
      $('a') 
       .lightBox(); // Select all links in the page 
      // ... The possibility are many. Use your creative or choose one in the examples above 
     }); 
     $(function() 
     { 
      $.ajax(
      { 
       url: 'survey.html', 
       dataType: 'html', 
       success: function (data) 
       { 
        $('#somehiddendiv') 
         .html(data); 
       } 
      }); 
     }); 
    </script> 
</head> 

<body> 
    <!-- <a href="egypt.jpg"><img src="download.jpg" width="72" height="72" alt="" /></a> 
--> 
    <div id="somehiddendiv"></div>

</body>

来源

2012-10-04 jonleech

使用ajax调用获取其他页面并在正确的事件中填充灯箱？ – Johan

对不起，我不太明白你在说什么。 – jonleech

新增示例 – Johan

您还可以使用fancybox插件为同一目的

$(document).ready(function() { 

    /* This is basic - uses default settings */ 

    $("a#single_image").fancybox(); 

    /* Using custom settings */ 

    $("a#inline").fancybox({ 
     'hideOnContentClick': true 
    }); 

    /* Apply fancybox to multiple items */ 

    $("a.group").fancybox({ 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic', 
     'speedIn'  : 600, 
     'speedOut'  : 200, 
     'overlayShow' : false 
    }); 

});

来源

2012-10-04 09:20:46 Anshu

我读过fancybox也在iframe中打开html。 – jonleech

$(function(){ 

    $.ajax({ 
     url: 'yourotherhtmlpage.html', 
     dataType: 'html', 
     success: function(data){ 
      $('#somehiddendiv').html(data); 
     } 
    }); 
});

然后添加一个链接或任何打开的窗口灯箱股利。或者通过代码打开它。

来源

2012-10-04 09:21:58 Johan

对不起，我是jquery和所有新手。所以我在pastebin中添加了什么我可以添加链接？ – jonleech

@jonleech看起来不像fancybox支持div弹出窗口，只有iamges。尝试使用此代码的fancybox – Johan

回答

相关问题