个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
25
4
我正在尝试为我的 HTML5 站点实现一个为 XHTML 1.0 文档类型编写的 JQuery 图片库，问题是我不能在 HTML5 中使用自定义“rel”属性:
<!-- In <head> tag -->
<script type="text/javascript">
$(document).ready(function(){
$("a[rel='first_gallery']").colorbox({opacity: ".75"});
$("a[rel='second_gallery']").colorbox({opacity: ".75"});
});
</script>
<!-- In <body> tag -->
<a href="first_gallery/1.jpg" title="Image 1" rel="first_gallery"><img src="images/1_thumbnail.jpg" alt="Image 1 Thumbnail"/></a>
<a href="second_gallery/2.jpg" title="Image 2" rel="second_gallery"><img src="images/2_thumbnail.jpg" alt="Image 2 Thumbnail"/></a>
我已经尝试使用 HTML5 自定义“data-rel”属性而不是“rel”，但我的 JQuery 有什么问题？
<!-- In <head> tag -->
<script type="text/javascript">
$(document).ready(function(){
$("a[data-rel='first_gallery']").colorbox({opacity: ".75"});
$("a[data-rel='second_gallery']").colorbox({opacity: ".75"});
});
</script>
<!-- In <body> tag -->
<a href="first_gallery/1.jpg" title="Image 1" data-rel="first_gallery"><img src="images/1_thumbnail.jpg" alt="Image 1 Thumbnail"/></a>
<a href="second_gallery/2.jpg" title="Image 2" data-rel="second_gallery"><img src="images/2_thumbnail.jpg" alt="Image 2 Thumbnail"/></a>
最佳答案
我最近遇到了同样的问题，我完全明白你想要实现的目标，但首先我会修复你使用“rel”属性的初始代码”
请注意，“rel”属性是 jquery.colorbox 对象中的一个选项:
<!-- In <head> tag -->
<script type="text/javascript">
$(document).ready(function(){
$("a").colorbox({ rel: "first_gallery", opacity: ".75"}); // this means <a rel="first_gallery" …>
$("a").colorbox({ rel: "second_gallery", opacity: ".75"}); // this means <a rel="second_gallery" …>
});
</script>
<!-- In <body> tag -->
<a rel="first_gallery" href="first_gallery/1.jpg" title="Image 1"><img src="images/1_thumbnail.jpg" alt="Image 1 Thumbnail"/></a>
<a rel="second_gallery" href="second_gallery/2.jpg" title="Image 2"><img src="images/2_thumbnail.jpg" alt="Image 2 Thumbnail"/></a>
如您所知，上面的示例不会验证为 HTML5，因为“rel”的值不会验证。
如果你想使用“data-rel”你的代码应该是这样的:
<!-- In <head> tag -->
<script type="text/javascript">
$(document).ready(function(){
$("a").colorbox({ rel: $(this).data('rel'), opacity: ".75"});
});
</script>
rel: $(this).data('rel') 告诉 jquery.colorbox 使用“data-rel”来包装画廊。它有一些限制:您不能使用自定义“data-”属性，也不能使用“data-rel”中的值。
上面的代码将适用于使用“data-rel”的两个画廊:
<!-- In <body> tag -->
<a data-rel="first_gallery" href="first_gallery/1.jpg" title="Image 1"><img src="images/1_thumbnail.jpg" alt="Image 1 Thumbnail"/></a>
<a data-rel="second_gallery" href="second_gallery/2.jpg" title="Image 2"><img src="images/2_thumbnail.jpg" alt="Image 2 Thumbnail"/></a>
如果您想为不同的画廊设置不同的选项，比如不同的不透明度，缺点就来了，一个实际的例子是:
<!-- In <head> tag -->
<script type="text/javascript">
$(document).ready(function(){
$("a.gallery1").colorbox({ rel: $(this).data('rel'), opacity: ".75"});
$("a.gallery2").colorbox({ rel: $(this).data('rel'), opacity: ".80"});
});
</script>
<!-- In <body> tag -->
<a class="gallery1" data-rel="first_gallery" href="first_gallery/1.jpg" title="Image 1"><img src="images/1_thumbnail.jpg" alt="Image 1 Thumbnail"/></a>
<a class="gallery2" data-rel="second_gallery" href="second_gallery/2.jpg" title="Image 2"><img src="images/2_thumbnail.jpg" alt="Image 2 Thumbnail"/></a>
我希望我的解释没有让您感到困惑。
关于javascript - 在 JQuery 中将 rel 属性更改为 data-rel 以使用 HTML5，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12878207/
25
4
0
我有一个功能是转换 ADO Recordset 进入html: class function RecordsetToHtml(const rs: _Recordset): WideString; 该函
经过几天的研究和讨论，我想出了这种方法来收集访客的熵(你可以看到我的研究历史here) 当用户访问时，我运行此代码: $entropy=sha1(microtime().$pepper.$_SERVE
给定一个无序列表 List ，我需要查找是否存在 String与提供的字符串匹配。 所以，我循环 for (String k : keys) { if (Utils.keysM
我已经搜索过这个问题，但没有找到我正在寻找的答案。 基本上，我想将类构造函数包装在 try/except 子句中，以便它忽略构造函数内特定类型的错误(但无论如何都会记录并打印它们)。我发现做到这一点的
我有一组三个数字，我想将一组数字与另一组数字进行比较。即，第一组中的每个数字小于另一组中的至少一个数字。需要注意的是，第一组中的下一个数字必须小于第二组中的不同数字(即，{6,1,6} 对 {8,8,
关闭。这个问题是off-topic .它目前不接受答案。 想改进这个问题吗？ Update the question所以它是on-topic用于堆栈溢出。 关闭 9 年前。 Improve this
首先介绍一下背景: 我正在开发一个带有 EJB 模块和应用程序客户端模块的企业应用程序 (ear)。我还使用 hibernate JPA 来实现持久性，并使用 swingx 来实现 GUI。这些是唯一
我正在尝试在我的上网本上运行 Eclipse 以便能够为 Android 进行开发。 您可能已经猜到了，Eclipse 非常慢，并且不容易有效地开发。 我正在使用 Linux Ubuntu 并且我还有
for row, instrument in enumerate(instruments): for col, value in enumerate(instrument):
return not a and not b ^ 我如何以更好的格式表达它 最佳答案 DeMorgan's Law ， 也许？ return not (a or b) 我认为在这一点上已经足够简单了
我正在尝试让 Font Awesome 图标看起来更 slim https://jsfiddle.net/cliffeee/7L6ehw9r/1/ . 我尝试使用“-webkit-text-strok
假设我有一个名为 vals 的数据框，如下所示: id…………日期…………min_date…… .........最大日期 1…………2016/01/01…………2017/01/01…………2018/
是否有更 Pythonic 的方式来做到这一点？: if self.name2info[name]['prereqs'] is None: se
我有一个函数可以将一些文本打印到它接收到的 ostream&。如果 ostream 以终端为目标，我想让它适应终端宽度，否则默认为某个值。 我现在做的是: 从 ostream 中获取一个 ofstre
这个问题在这里已经有了答案: Should a retrieval method return 'null' or throw an exception when it can't produce
我有这个 bc = 'off' if c.page == 'blog': bc = 'on' print(bc) 有没有更 Pythonic(和/或更短)的方式在 Python 中编写？ 最佳
输入:一个包含 50,000 行的 CSV；每行包含 910 列值 0/1。 输出:运行我的 CNN 的数据框。 我编写了一个逐行读取 CSV 的代码。对于每一行，我将数据分成两部分，称为神经元(90
据我所知，with block 会在您退出 block 后自动调用 close()，并且它通常用于确保不会忘记关闭一个文件。 好像没有技术上的区别 with open(file, 'r+') as f
我有一个使用 Entity Framework V6.1.1 的 MVC 5 网站。 Entity Framework DbContext 类和模型最初都在网站项目中。这个项目有 3 个 DbCont
我是编程新手，在尝试通过将 tableView 和关联 View 的创建移动到单独的类并将委托(delegate)和数据源从 VC 移动到单独的类来精简我的 ViewController 时遇到了一些
我是一名优秀的程序员,十分优秀！