Advanced Search

Test case: PrototypeJS cause jQuery ui's slider widget failing in IE8

/ Published in: HTML
Save to your folder(s)
Source code for http://stackoverflow.com/questions/3740245

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <head>
  5.   <!-- eliminating the following line resolves the bug -->
  6.   <script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js" type="text/javascript"></script>
  7.   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
  8.   <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" type="text/javascript"></script>
  9.   <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/base/jquery-ui.css" type="text/css" />
  10.   <script type="text/javascript">
  11.     var $j = jQuery.noConflict();
  12.     $j(function () {
  13.       var setupVolumeSlider = function () {
  14.         $j("#volume-slider").slider({
  15.           orientation: "vertical",
  16.           min: 0,
  17.           max: 100
  18.         });
  19.       };
  20.       setupVolumeSlider();
  21.     });
  22.   </script>
  23.   <style type="text/css">
  24.     body { padding: 100px; }
  25.     div#volume-slider { height: 100px;}
  26.   </style>
  27.   </head>
  28.   <body>
  29.     <div id="volume-slider"></div>
  30.   </body>
  31. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.