Posted By

simon87ainley on 07/12/10

Tagged

Versions (?)

Last Edited at 07/12/10 06:56pm

Statistics

Viewed 853 times

Favorited by 0 user(s)

Related snippets

jQuery rounded corners

/ Published in: JavaScript

A light-weight solution for x-browser rounded corners solution, degrades gracefully back to square corners

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

$( "div.rounded" ).each( function( i ) {
		$( this ).prepend( '<span class="rounded_top_left"></span>' );
		$( this ).prepend( '<span class="rounded_top_right"></span>' );
		$( this ).append( '<span class="rounded_bottom_left"></span>' );
		$( this ).append( '<span class="rounded_bottom_right"></span>' );
	});
 
	// Add rounded corners to the left corners
	$( "div.rounded_left" ).each( function( i ) {
		$( this ).prepend( '<span class="rounded_top_left"></span>' );
		$( this ).append( '<span class="rounded_bottom_left"></span>' );
	});
 
	// Add rounded corners to the right corners
	$( "div.rounded_right" ).each( function( i ) {
		$( this ).prepend( '<span class="rounded_top_right"></span>' );
		$( this ).append( '<span class="rounded_bottom_right"></span>' );
	});
 
	// Add rounded corners to the top corners
	$( "div.rounded_top" ).each( function( i ) {
		$( this ).prepend( '<span class="rounded_top_left"></span>' );
		$( this ).prepend( '<span class="rounded_top_right"></span>' );
	});
 
	// Add rounded corners to the bottom corners
	$( "div.rounded_bottom" ).each( function( i ) {
		$( this ).append( '<span class="rounded_bottom_left"></span>' );
		$( this ).append( '<span class="rounded_bottom_right"></span>' );
	});