Home/ Questions/Q 3341682
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T00:45:03+00:00

I can’t get a jQuery UI modal dialog it to work as in the

  • 0

I can’t get a jQuery UI modal dialog it to work as in the demo! Consider this recipe:

<html>
  <head>
    <script type="text/javascript" src="/javascripts/jquery.js"></script>
    <script type="text/javascript" src="/javascripts/jquery-ui.js"></script>
  </head>
  <body>
    <p>First open a modal <a href="" onclick="$('<div>something</div>').dialog({modal: true}); return false;"> dialog</a></p>
    <p>Then try to hover over <a href="broken"> me</a></p>
    <p>And <a onclick="alert('clicked!'); return false;" href="alsobroken"> click me!</a></p>
  </body>
</html>

While the dialog is active, the second link is correctly disabled but the third link (onclick) still works! Also, the little browser hand appears when hovering both links. This is not like the demo… what am I doing wrong?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As Pointy points out, this is normally controlled by the jQueryUI CSS. But one can get around it by adding slightly hackish snippet to one’s CSS file.

    .ui-widget-overlay { 
    height:100%; 
    left:0; 
    position:absolute; 
    top:0; 
    width:100%; 
 }

    That way the “shroud” div covers up all buttons and there’s no need to use the jQueryUI CSS.

    • 0