AUIカルーセルの画像へのリンクを追加するには

liferay DXP（v 3.0）でAUIカルーセルを使用する。 Liferay DXPは、AUIバージョン3.0 を使用して、それぞれ異なるURLにリダイレクトしています。デモコードのリダイレクトを以下の場合はAUIカルーセルの画像へのリンクを追加するには

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

どれソリューションを動作していません？

出典

2017-07-13 Sagar Ravikirti

私は[JSFiddleに]あなたのコードをロードする理由（HTTPS ：//jsfiddle.net/xuyz23ft/）「YUIが定義されていません」というJSエラーが出ます。必要なスクリプトをすべて含んでいますか？また、本文の最後の前にスクリプトブロックを移動することを検討する必要があります。 –

このコードをメモ帳にコピーしてsomething.htmlとして保存してください...（インターネット接続はそこにあるはずです） –

http://meta.stackexchange.com/questions/141823/why-is-cross-posting-wrong-外部サイト上 –

この戦略は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); 
});

出典

2017-07-13 13:41:02 stiemannkj1

AUIカルーセルの画像へのリンクを追加するには

答えて

関連する問題