jQuery UI可拖動事件沒有在滾動發佈

我正在應用jQuery UI庫的可拖動事件到一個彈出窗口。拖動效果很好，但問題是，如果窗口有滾動，並且如果我點擊滾動拖動事件被觸發，並且彈出窗口正在移動，並且拖動事件不會被釋放，即使滾動事件被釋放......您可以打電話給我如何克服它...jQuery UI可拖動事件沒有在滾動發佈

這裏是我的代碼片段.....請檢查並讓我知道什麼是錯誤

<html> 
<head> 
    <title> New Document </title> 
    <meta name="Generator" content="EditPlus"> 
    <meta name="Author" content=""> 
    <meta name="Keywords" content=""> 
    <meta name="Description" content=""> 

    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js" ></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" ></script> 

<style> 
    #Outer{ 
    width:400px; 
    height:100px; 
    border:1px solid blue; 
    position:absolute; 
    overflow:auto; 
    } 
    #Hdr{ 
    background:#ffcc99; 
    border-bottom:1px solid blue; 
    } 
</style> 
</head> 

<body> 
    <div id="Outer"> 
    <div id="Hdr">About India</div> 
    <div> 
     The Indian economy is the world's tenth-largest by nominal GDP and third-largest by purchasing power parity (PPP). 
     Following market-based economic reforms in 1991, India became one of the fastest-growing major economies; it is considered a 
     newly industrialised country. However, it continues to face the challenges of poverty, illiteracy, corruption, and inadequate public healthcare. 
    </div> 
    </div> 
    </body> 

    <script> 
    $(document).ready(function(){ 
    $('#Outer').draggable(); 
    }); 
    </script> 
</html>

來源

2012-03-09 Rama Rao M

您可能需要使用一個處理程序來繞過這個問題：像這裏fiddle

HTML：

<div id="Outer"> 
    <div id="Hdr">About India</div> 
    <div id="Inner"> 
     The Indian economy is the world's tenth-largest by nominal GDP and third-largest by purchasing power parity (PPP). 
     Following market-based economic reforms in 1991, India became one of the fastest-growing major economies; it is considered a 
     newly industrialised country. However, it continues to face the challenges of poverty, illiteracy, corruption, and inadequate public healthcare. 
    </div> 
    </div>

CSS：

#Outer{ 
    width:400px; 
    border:1px solid blue; 
    position:absolute; 
    } 
#Inner { 
    width:400px; 
    height:80px; 
    position:absolute; 
    border:1px solid blue; 
    overflow:auto; 
} 
    #Hdr{ 
    background:#ffcc99; 
    border-bottom:1px solid blue; 
    }

JS：

$(document).ready(function(){ 
     $('#Outer').draggable({handle: "#Hdr"}); 
    });

來源

2012-03-09 12:53:22

jQuery UI可拖動事件沒有在滾動發佈

回答

相關問題