我正在尝试使用 Fancybox 来“扩展”页面上的内联元素,以使其更易于阅读。在其原始位置,该元素是可见的,但样式设置为显示在一个小滚动框中。下面是一个展开链接。单击该链接会调用 Fancybox 将元素放入 Fancybox 中。
一切都很好。
但是,当您单击“关闭”时,它会将原始元素放回到原来的位置,但它会将 style="display:none" 作为属性添加到元素中,从而导致文本消失。
这是一个最小的案例示例,显示了会发生什么。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Fancy Box data test</title>
<meta name="generator" content="BBEdit 10.5" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" >
jQuery.noConflict();
jQuery(document).ready( function() {
jQuery("a#inline").fancybox(
{
'hideOnContentClick': true
})
}
);
</script>
<style type="text/css">
.agreement-content {
overflow:auto;
height:12em;
padding:10px;
background-color:#fbfaf6;
border:1px solid #bbb6a5;
width: 300px;
margin: 30px;
}
</style>
</head>
<body>
<p>
This …Run Code Online (Sandbox Code Playgroud)