Перетаскиваемое событие JQuery UI не запускается при прокрутке - PullRequest
Новая
       10

Перетаскиваемое событие JQuery UI не запускается при прокрутке

0 голосов
/ 09 марта 2012

Я применяю перетаскиваемое событие библиотеки 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>

1 Ответ

3 голосов
/ 09 марта 2012

Вы можете использовать обработчик, чтобы обойти эту проблему: Как здесь 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"});
   });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...