在将我的内容注入fancybox 中的iframe 之后。框架可见 1 秒钟,然后消失。这发生在chrome和firefox中。
这是我的代码:
<script type="text/javascript">
$(document).ready(function() {
var f, txt, d, ifrmwin,edd;
var getContent = function(){
return $("#iframe-content").contents().find("html").html();
};
$('.push_preview_lightbox_menu_iphone').fancybox({
type: 'iframe',
onComplete: function(){
$('#fancybox-content iframe').removeAttr("src");
var $iframeWrap = $("<div id=\"preview_smartphone\" style=\"margin: 0 auto; width: 550px;height:445px;\"></div>")
.append(
$('<div style=\"width: 350px;height: 445px;overflow: hidden;cursor: pointer;margin-left: 45px;\"></div>')
.append(
$('<iframe></iframe>', {id: 'preview-iframe',width:"268px", height:"445px"})
)
);
eff = $('#fancybox-content iframe')[0].contentWindow.document;
$("html", eff).append($iframeWrap);
edd = $("#preview-iframe")[0].contentWindow.document;
$("html", edd).append(getContent());
},
});
});
</script>
iFrame 是与页面其余部分相同的域。
有人有想法吗?
非常感谢和最好的问候!
编辑:
好的..这是解决方案:
<script type="text/javascript">
$(document).ready(function() {
var f, txt, d, ifrmwin,edd;
var getContent = function(){
return $("#iframe-content").contents().find("html").html();
};
$('.push_preview_lightbox_menu_iphone').fancybox({
'content': function() {
return $('div#content').html() + '<div id="preview_smartphone" style="margin: 0 auto;">'
+ '<div style="width: 250px;height: 445px;overflow: hidden;cursor: pointer;margin-left: 45px;">'
+ '<iframe width="268px" height="445px" id="preview-iframe" frameborder="0">'
+ '</iframe></div></div>';
},
onComplete: function(){
eff = $('#preview-iframe')[0].contentWindow.document;
$("body", eff).append(getContent());
},
});
});
</script>