Rounded corners without images using Javascript and CSS

posted in: Javascript | 0

Summary:

To get rounded corners we are using images  and 2 or 3  div tags with  css styles.

If we use only CSS,  IE browser shows squared corners .

To avoid these problems use Nifty Cube plug in.
Nifty Corners Cube :
Nifty Corners are a solution based on CSS and Javascript to get rounded corners without images.

It is simpler to use and it supports in all browsers.

This plugin supports all CSS Selectors for target and takes only two parameters.

To use this we need,

  • A javascript file, named “niftycornerscube.js”
  • A CSS file, named “niftycorners.css”
  • The javascript calls specific for the pages.

Example:

<script type=”text/javascript” src=”niftycube.js”></script>

<script type=”text/javascript”>
window.onload=function(){
Nifty(“div#box”,”big”);
}
</script>

Description: Nifty function receives two parameters. Parameters have to be specified between quotes and separated by a comma. The first parameter is for the CSS selector that targets the elements to round, while the second parameter is for options for default cases could be omitted.

With this we can develop a tabbed menu, buttons, rounded corner div with a background, corners layouts and ect..

For more details and examples refer:

 

http://www.html.it/articoli/niftycube/index.html

Previous Post

Leave a Reply