Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

Troubleshooting
Research
Professional Opinions
Ask a Question
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

troubleshooting Question

jQuery resizable bug in Opera

Avatar of josephdaviskcrm
josephdaviskcrmFlag for United States of America asked on
Web DevelopmentCSSHTMLjQuery
6 Comments1 Solution632 ViewsLast Modified:
I'm experiencing a problem with the jQuery resizable functionality in Opera only, which is odd.  Usually its IE that gives the problems.  

What I'm experiencing is that during the resize operation, the div tag suddenly increases it's height by a large amount.  After I noticed the problem was occuring in my application I ported it over to this simple example that I have posted here to see if in the most basic circumstance the problem was still occuring, and it is.  I wondered if it was a problem with having draggable and resizable applied to the same div tag, but the problem still occurs when just resizable is applied.

Can someone please:

Verify that this same thing is happening when you run the code below.

Identify a work around that I might be able to implement to get this to work.

Thanks,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server">
    <title>Opera Test</title>
    <link href="CSS/jquery-ui.css" rel="stylesheet" type="text/css" />
    <script src="JavaScript/jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="JavaScript/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script>
    <script type="text/javascript">
      $(function () {
        //$('#Mover').draggable({ containment: 'parent', handle: '#Shaker' });
        $('#Mover').resizable();
      });
    </script>
  </head>

  <body>
    <form id="form1" runat="server">
      <div style="position:absolute; width:400px; height:400px; top:50px; left:50px; background-color:#FFDDFF">

        <div id="Mover" style="position:absolute; width:75px; height:75px; top:25px; left:25px; background-color:#DDFFDD">
          <div id="Shaker" style="height:15px; background-color:#AADDAA;"></div>
        </div>

      </div>
    </form>
  </body>
</html>
ASKER CERTIFIED SOLUTION
Avatar of Lukasz Chmielewski
Lukasz ChmielewskiFlag of Poland image

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Commented:
This problem has been solved!
Unlock 1 Answer and 6 Comments.
See Answers