Return to Snippet

Revision: 9459
at April 7, 2011 03:56 by chrisaiv


Updated Code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
	<!-- JQUERY Framework -->
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.curvycorners.packed.js"></script>

	<script type="text/javascript">
	$(document).ready(function(){						
		//Rounded Corners
		$("#feature1").corner();
	});	
	</script>
	<style type="text/css" media="screen">
		#feature1{
			float: left;
			height: 6em;
			width: 14em;
			min-height: 12em;
			margin-right: 1.5em;
			margin-bottom: 2em;
			padding: 0 1em;
		}		
	</style>
</head>
<body>
	
<div id="feature1">
	<h4>Rounded!</h4>
</div>

</body>
</html>

Revision: 9458
at November 7, 2008 19:11 by chrisaiv


Initial Code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
	<!-- JQUERY Framework -->
	<script type="text/javascript" src="js/lib/jquery/jquery-compressed.js"></script>
	<script type="text/javascript" src="js/jquery.curvycorners.packed.js"></script>

	<script type="text/javascript">
	$(document).ready(function(){						
		//Rounded Corners
		$("#feature1").corner();
	});	
	</script>
	<style type="text/css" media="screen">
		#feature1{
			float: left;
			height: 6em;
			width: 14em;
			min-height: 12em;
			margin-right: 1.5em;
			margin-bottom: 2em;
			padding: 0 1em;
		}		
	</style>
</head>
<body>
	
<div id="feature1">
	<h4>Rounded!</h4>
</div>

</body>
</html>

Initial URL
http://www.malsup.com/jquery/corner/

Initial Description
You will need to download a few things to easily create rounded corners.  They are jQuery (http://jquery.com/) and the jQuery rounded corners plug-in (http://www.malsup.com/jquery/corner/).

Initial Title
JQuery: Rounded Corners

Initial Tags
javascript, jquery

Initial Language
JavaScript