Bootstrap模態+旋轉木馬。下一個和prev幻燈片不會出現與通過JavaScript轉換

我使用模式窗口內的boostrap旋轉木馬。Bootstrap模態+旋轉木馬。下一個和prev幻燈片不會出現與通過JavaScript轉換

的該代碼如下所示：

<div id="modal-window-slideshow" data-backdrop="static" class="modal-huge hide fade"> 
    <div class="modal-header"> 
    <button type="button" data-dismiss="modal" class="close" aria-hidden="true">×</button> 
    <h3>Slides</h3> 
    </div> 
    <div class="modal-huge-body"> 
    <div id="myCarousel" class="carousel slide"> 
     <!-- Carousel items --> 
     <div id="div-carousel-items" class="carousel-inner"> 

     <!-- Carousel nav --> 
     <a href="#myCarousel" data-slide="prev" class="carousel-control left">‹</a> 
     <a href="#myCarousel" data-slide="next" class="carousel-control right">›</a> 
    </div> 
    </div> 
</div>

當用戶點擊Next和Prev按鈕，一切工作正常。但我也想讓用戶通過鍵盤上的左右箭頭進行導航。我寫了代碼，但它遇到了一個奇怪的問題：在這種情況下，轉換動畫不起作用。我可以啓用它嗎？

我的腳本

$(document).keypress(function(event) { 
    var LEFT_ARROW = 39; var RIGHT_ARROW = 37; 

    if (typeof event !== 'undefined' && $('#modal-window-slideshow').is(':visible')) { 
    if (event.keyCode === RIGHT_ARROW) { 
     $(this).carousel('next'); 
    } 

    if (event.keyCode === LEFT_ARROW) { 
     $(this).carousel('prev'); 
    } 
    } 
    return true; 
});

來源

2012-10-28 ExiRe

keyCode 39是右箭頭。 37被留下。 http://msdn.microsoft.com/en-us/library/aa243025(v=vs.60).aspx –

我想，我找到了解決辦法。我只是尋求必要的鏈接，然後點擊它。

$(document).keypress(function(event) { 
    var LEFT_ARROW = 39; var RIGHT_ARROW = 37; 

    if (event.keyCode === RIGHT_ARROW) { 
     $('a.carousel-control.right').trigger('click'); 
    } 

    if (event.keyCode === LEFT_ARROW) { 
     $('a.carousel-control.left').trigger('click'); 
    } 
    ... 
});

來源

2012-10-28 14:19:53 ExiRe

$(document).bind('keyup', function(e) { 
    if(e.keyCode==39){ 
    //keycode for right arrow 
    } 
    else if(e.keyCode==37){ 
    // keycode for left arrow 
    } 
});

來源

2013-03-11 01:09:02 dd263

這對我有效... – dd263

我已經使用這個代碼，未來，和以前的頁面，用一個id組合型是下一個被稱爲和以前

$(document).keyup(function(e) { 

      if (e.keyCode == 39) { 
       window.location.href = $("#next").attr('href'); 
      } 
      if(e.keyCode==37){ 
       window.location.href = $("#previous").attr('href'); 
      }});

所以，如果你在HTML頁面中有一個元素，或者帶有這個id的php頁面，該功能專門用於該ID。

例子：

<div class="buttons"> <a href="www.urlpage.tld/previous/" class="prev" id="previous" title="Previous Page"></a> <a href="www.urlpage.tld/next/" class="next" id="next" title="Next Page"></a> </div>

我希望這可以幫助您。

問候！

來源

2014-01-05 12:47:30 Quimbo

Bootstrap模態+旋轉木馬。下一個和prev幻燈片不會出現與通過JavaScript轉換

回答

相關問題