焦點設置的fancybox 2

我曾經使用的onComplete功能的fancybox的早期版本將焦點設置到的fancybox（使網站對那些使用鍵盤更方便）。焦點設置的fancybox 2

看來的fancybox 2不遵循相同的語法。任何人都可以用一些代碼來幫助將焦點設置爲fancybox一旦呈現？

曾經是：

$(".fancybox-call").fancybox({ 
       padding: 20, 
     fitToView : false, 
     width  : 960, 
     height  : 615, 
     autoSize : false, 
     closeClick : false, 
     openEffect : 'none', 
     closeEffect : 'none', 
       type    : 'inline', 
       onComplete : function() { 
              $(".fancybox-wrap").focus(); 
           } 
});

現在嘗試：

$('a#feedback-button').each(function(){ 
    $(this).fancybox({ 
      padding  : 0, 
      fitToView : false, 
      width  : 700, 
      height  : 820, 
      autoSize : false, 
      closeClick : false, 
      openEffect : 'none', 
      closeEffect : 'none', 
      type  : 'iframe', 
      scrolling : 'no', 
      beforeShow : function() { 
          $(".fancybox-inner").focus(); 
         } 
    });

沒有運氣。

沒有設置焦點的fancybox，鍵盤用戶經歷了整個調用頁有標籤，得到的fancybox內訪問形式之前。

來源

2012-12-06 kavallier

在而在第二的iframe您的目標內聯內容的第一示例。你應該真正嘗試像'$（ '的fancybox的iframe '）的iframe內的目標選擇的內容（）找到對焦（）。（' 選擇'）;' – JFK

首先，感謝您的回覆。嘗試了你的建議，但沒有運氣。與其他參賽者是否有衝突？ – kavallier

應該工作，你可以看到在這裏http://stackoverflow.com/a/2940770/1055987（答案是爲V1.3.4，但只是改變選擇器類V2.X） – JFK

隨着2.1.4的fancybox的，關閉按鈕爲錨並沒有更多的div標籤，所以我只設置這個代碼把重點放在關閉按鈕：

afterShow: function(){ 
    $('.fancybox-close').focus(); 
}

我也改變了按鍵的配置，以刪除由回車鍵觸發的下一個鏈接，所以回車鍵將關閉Fancybox：

keys : { 
    next : { 
     34 : 'up', // page down 
     39 : 'left', // right arrow 
     40 : 'up' // down arrow 
    }, 
    prev : { 
     33 : 'down', // page up 
     37 : 'right', // left arrow 
     38 : 'down' // up arrow 
    }, 
    close : [27], // escape key 
    play : [32], // space - start/stop slideshow 
    toggle : [70] // letter "f" - toggle fullscreen 
},

來源

2013-04-04 09:20:31

以下應該添加到fancybox調用。它適用於所有的內容（聯機，AJAX或HTML）

afterShow: function() { 
    $(this.content).attr("tabindex",1).focus() 
}

所以的fancybox調用應該的樣子。

$(".your_element_class").fancybox({ 
    afterShow: function() { 
     $(this.content).attr("tabindex",1).focus() 
    } 
});

請改爲「your_element_class」的類在其上調用的fancybox您的HTML元素。

來源

2017-03-02 23:07:54

焦點設置的fancybox 2

回答

相關問題