josephdaviskcrm
asked on
jQuery resizable bug in Opera
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,
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
I'm not sure what you're talking about.
Hi,
Do you know about css hack for IE.
If yes then in similar way try for opera too.
Do you know about css hack for IE.
If yes then in similar way try for opera too.
ASKER
Can you please provide an example?
ASKER
And have you tested the code I posted and verified that this bug is occurring on your end as well?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Pls try to use opera hack for css if any.
Ya its normally issue of IE