Button for Web

Post about projects that use Inkscape for web design.
weillerronfini
Posts: 1
Joined: Wed Dec 12, 2012 11:36 am

Button for Web

Postby weillerronfini » Thu Jun 20, 2013 5:22 am

Greetings to all. I come here to ask for a help to you as I study Web Design and am developing a layout to create a website in browsers updated in SVG, and I would like to know how to make this button, I want to work, so it appears as follows :

I have a text button, where the original state it is like this:

Image

When I move the mouse over, I want while I hover over it, it becomes this state:

Image

When I click it, I want that for my pressing the mouse button, it looks like this:

Image

And after I have clicked on it, he stays in this state:

Image

Is it possible to do this in SVG, using Inkscape or have a technique that can be applied?

Thanks to all.

Have a great afternoon.

FYI: Weiller Braga

Lazur
Posts: 4717
Joined: Tue Jun 14, 2016 10:38 am

Re: Button for Web

Postby Lazur » Thu Jun 20, 2013 7:51 am

Welcome aboard!

It is possible.
Draw the basic elements in inkscape, preferably save as plain svg, then
open the svg in a notepad and add the right codes manually.
Have a look at these:
http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Web-Inkscape.html
http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Web.html
http://tavmjong.free.fr/SVG/BUTTON_TEST/button_test.xhtml
http://tavmjong.free.fr/blog/?p=36

Good luck!


Return to “Inkscape & the Web”