UI jQuery的滾動預防

我使用這個代碼來創建繪圖畫布的頂部的消息，並將其工作正常，但有時用戶滾動屏幕和變形繪圖頁UI jQuery的滾動預防

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>jQuery UI Dialog - Modal message</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <link rel="stylesheet" href="http://sktcho.com/wp-includes/qp2qp-sktcho/style.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
    $(function() { 
    $("#dialog-message").dialog({ 
     modal: true, 



     buttons: { 
     Ok: function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div id="dialog-message" title="Quick tutorial"> 
<div id="dialog" title="Basic dialog"> 


<p> <center><font size="4" color="black">use two fingers to draw and one finger to move the screen</font></center></p> 
<p> <center><font size="4" +/- to zoom in & out</font></center></p> 
    <p><img border="0" src="http://sktcho.com/wp-includes/qp2qp-sktcho/giphy.gif"></p> 
</div> 


</body> 
</html>

我能做些什麼以防止滾動，如果我不能如何使畫布頁面回滾到它是什麼

來源

2017-03-26 طارق بك محمود

我錯過了一些代碼，即實際的繪圖畫布以及將的類設置爲.modal-open（您在CSS中）的部分。請更新您的問題。（Temp。Fiddle here：https://jsfiddle.net/6kcwtqov/） –

謝謝你的幫助..畫布的html文件是http://www.sktcho.com/wp-includes/qp2qp-sktcho/的index.html –

如果您想在打開對話框時停止用戶滾動，您可以更改您的對話框代碼，如下所示。

$(function() { 
    $("#dialog-message").dialog({ 
     modal: true, 
     "allowScrolling": false, 
     buttons: { 
     Ok: function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 
});

檢查this answer，如果你想要其他選項。

來源

2017-03-27 08:15:39 bpjoshi

UI jQuery的滾動預防

回答

相關問題