gpt4 book ai didi

javascript - 如何添加 AUI 轮播图像的链接

转载 作者:行者123 更新时间:2023-11-28 04:25:49 25 4
gpt4 key购买 nike

在 liferay DXP (v 3.0) 中使用 AUI 轮播。Liferay DXP使用AUI 3.0版本在每个图像上,它都重定向到不同的网址。对于以下演示代码重定向不起作用

<html>
<head>
<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css"
rel="stylesheet"></link>

<script>
YUI().use(
'aui-carousel',
function(Y) {
new Y.Carousel(
{
activeIndex: 'rand',
contentBox: '#myCarousel',
height: 250,
intervalTime: 2,
width: 700
}
).render();
}
);

</script>


</head>
<body>


<div id="myCarousel">

<a href="http://www.example1.com"><div class="image-viewer-base-image" style="background: url(http://alloyui.com/carousel/img/2.jpg);"></div></a>
<a href="http://www.example2.com"><div class="image-viewer-base-image" style="background: url(http://alloyui.com/carousel/img/3.jpg);"></div></a>
<a href="http://www.example3.com"><div class="image-viewer-base-image" style="background: url(http://alloyui.com/carousel/img/4.jpg);"></div></a>
</div>

</body>
</html>

有什么解决办法吗?

最佳答案

该策略适用于 AlloyUI 2.0.0 ,所以这似乎是 AlloyUI 3.0.0 中的一个错误.

此错误的一种可能的解决方法是选择所有 <img>标记轮播的子项并用适当的 <a> 包裹它们以编程方式标记:

Y.all('#myCarousel img').each(function(img) {
var imgParent = img.parent;
var link = document.createElement('a');
link.href = 'http://www.google.com';
imgParent.replaceChild(link, img);
link.appendChild(img);
});

关于javascript - 如何添加 AUI 轮播图像的链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45074349/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com