Question

在liferay DXP（v 3.0）中使用AUI轮播。 Liferay DXP使用AUI 3.0版在每个图像上，它已重定向到不同的URL。对于以下演示代码重定向不起作用

<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>

任何解决方案??

Answer 1

该策略适用于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);
});

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

1 个答案: