Jump to content

rounded corner


csckid

Recommended Posts

I managed to create a rounded corner div using jquery. But, when i use the code

$("#expansion").show("slow");

rounded corner shape get distorted in IE. In rest of the browser it works well.

 

If i use the code

$("#expansion").animate({ height: 100}, "slow");

it works well in all browser....

 

Q) how can i get rounded corner div in IE ann using code 

$("#expansion").show("slow");

??

 

plz help

 

 

here is the full code


<html>
<head>

<title>Home</title>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.gradient.js"></script>
<script type="text/javascript" src="jquery.corner.js"></script>

<script type="text/javascript">
$(function () {

$("#write").corner();	


} );

</script>


<script type="text/javascript">
$(function () {



$("#expansion").hide();


} );
</script>



</head>

<body >

<div id="container">


		<table width="100%">
			<tr >
				<td >


						<div style="float:right; padding-right:20px;padding-top:10px"> 
						   <font size="-1" >
						   
						   					<span id="expand" >Expand&nbsp&nbsp&nbsp&nbsp	 </span>	
						   					<span id="contract" >Contract           </span>
						   
						  </font> 
						</div>

				</td>

			</tr>
			<tr>
				<td >
					<div id="expansion" >
				    
					<form><textarea rows='7' cols='60'></textarea></form><div id='write' style="width:110px; height:30px; background-color:#999999" onMouseOver='commentsover(this.id)' onMouseOut='commentsout(this.id)'>&nbsp&nbsp&nbsp&nbsp Comments</div>

					</div>
				</td>
				<!--end of expansion-->
			</tr>

		</table>




</div><!--end of container-->




<script type="text/javascript">
		function commentsover(name){
			document.getElementById(name).style.backgroundColor='#036400'
		}
		function commentsout(name){
			document.getElementById(name).style.backgroundColor=''
		}


		$(function () {
			$("#expand").click(function () {




						$("#expansion").show("slow");
						//document.getElementById("expansion").innerHTML="";



			});		



			$("#contract").click(function () {


						 $("#expansion").hide("slow");

			});		



		} );

</script>

</body>
</html>

 

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.