0

次のスクリプトがあります。div内の画像をクリックすると、対応するhrefリンクが新しいウィンドウで開きます。同時に、親ページでクリックされたdivが非表示になり、次のdivが表示されます。

「次へ」ボタンもあるので、画像をクリックせずに次のdivに進むために。この「次へ」ボタンは、現在のdivの対応するahrefを開きません。次のdivにスキップします。

これはすべて完全に機能していますが、クリックすると表示されているdivのhrefの場所に移動するボタンを追加しようとしています。

それは理にかなっていますか？

これがJSFiddleデモです：http：//jsfiddle.net/QTyRq/

そしてここにコードがあります...

<div id="container">
    <div class="imgrotation"><a href="http://google.com" target="_blank"><img src="abc.jpg" width="100" height="100" border="0" /></a></div>
    <div class="imgrotation"><a href="http://yahoo.com" target="_blank"><img src="def.jpg" width="200" height="200" border="0" /></a></div>
    <div class="imgrotation"><a href="http://msn.com" target="_blank"><img src="ghi.jpg" width="300" height="300" border="0" /></a></div>
    <div class="imgrotation"><a href="http://bing.com" target="_blank"><img src="jkl.jpg" width="400" height="400" border="0" /></a></div>
</div>

<button id="nextimg">Next Image</button>

<!--This is what I need added to JS -->
<button id="gotourl">Visit Site</button>

Jquery：

var alldoneURL = 'next-image-group.html'; //final click
function next(event, duration) {
    duration = duration || 900; // default value
    var that = $('.imgrotation:visible');
    if (that.next('.imgrotation').length) {
        that.fadeOut(duration, function() {
            that.next('.imgrotation').fadeIn(duration);
        });
    } else {
        window.location.href = alldoneURL;
    }
    return false;
}

$('.imgrotation').not(':first').hide();
$('.imgrotation a').click(

function(e) {
    e.preventDefault();
    var newWin = window.open(this.href), //(this.href, 'newWindow') to load all clicks in one window.open
        duration = 900;
    next(e, duration);
});
$('#nextimg').click(next);

</ p>

4

1 に答える 1

1

このjqueryの追加も機能します

$('#gotourl').on('click',function(){
      window.open($(".imgrotation:visible a").prop('href'));
});

</ p>

http://jsfiddle.net/QTyRq/3/

function$('#gotourl').on('click',function(){
    window.open($(".imgrotation:visible a").prop('href'));
    $('#nextimg').trigger('click');
});

<ahref = "http://jsfiddle.net/QTyRq/4/"rel="nofollow">両方でJSFIDDLEを更新

于 2012-05-22T19:32:31.663 に答える