Today we are going see and how to make a nice CSS3 Button Maker with three different styles viz., Glassy look, 3d look and Flat look.
Every website need a button for different purpose like form submission, navigation.. etc. I get bored by seeing the normal look of button so we go for customization and developed a Tool, when I am working for the project of css-factory.com. By this tool we can create awesome buttons by your creativity.
The contents required for button style is Button size, color , font-family etc. Our three styles are made using these contents and some external functionality.
The functionality is simple and is to develop:
Take a variable:
[code lang=”html”]
var text="";
[/code]
Give your style content to this variable as string
[code lang=”html”]
text=".glassy{";
text+="font-size:"+value+"px;";…………..
[/code]
Update this string every time when on change occurs by
[code lang=”html”]
$("style").replaceWith("<style>"+text+"</style>");
[/code]
Style developed by this CSS3 Button Maker is Compatible IE10+, Chrome and Mozilla
Leave a Reply