Showing posts with label GUI. Show all posts
Showing posts with label GUI. Show all posts

Sunday, 20 March 2011

custom cursors

A friend of mine from Second Life, four Yip, has seen the easy peasy site and has given me a huge list of resources, of which I will be making good usage! Thank you four Yip :-) 

So, here is one of them: Would you like a custom cursor for your site?

Think carefully before you say yes. While some people (myself included) will love them, others may become highly irritated by them; especially since they will not be getting the little hand thingy for the links. That said, if the answer is still yes - here is a good place for them: http://www.cursors-4u.com/




Find the one which you think will work well with your overall design scheme and then copy the code from the little box underneath it where it says "universal CSS/HTML code for your web page".

Now comes the important part: Paste this code onto a text file first since you will need to do some serious cleaning up before you can put it into the HTML editor. Here is what the code will look like:

<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth580.cur), progress;}</style><a href="http://www.cursors-4u.com/cursor/2011/02/16/sapphire-9.html" target="_blank" title="Sapphire"><img src="http://cursors-4u.com/support.gif" border="0" alt="Sapphire" style="position:absolute; top: 0px; right: 0px;" /></a>

Delete everything that is highlighted with red! Only keep the stuff that is highlighted with white, from <style type> to </style>, in other words. If you do not do this you will get a little "support Cursors4U" banner on your site. Which, in this case I find a bit excessive since Cursors4U seems to be doing quite nicely with lots of advertisements already.

Next step: Take the cleaned up code and paste it into the <head>, at the very bottom, just above the line which says <b:skin><![CDATA[/* and before </head>.

Done! You now have a custom cursor!

.................................................................................................................................

Thursday, 17 March 2011

all kinds of menus

You can find some very nice custom menus at http://bloggerhowtotips.blogspot.com/






























The image above shows you a selection from the available styles which you can generate on the site. On the left are vertical HTML/CSS menus and on the right are drop down vertical menus. Both pages give you the codes for all of the different design styles and also tell you exactly how to use them, which incidentally is through yet another HTML/CSS gadget - love these things!















And then there is also a smoothly animated multilevel drop down menu; again you can obtain the code for this from here, and again, this too works through the HTML/CSS gadget.

.............................................................................................................................

Wednesday, 16 March 2011

image based menus

Look on the left column right here on this site and you will see that the pages menu now has image buttons with rollovers instead of just plain text ones. This was done with a code generated here:
So easy it is almost ridiculous!

































Once you have the code, go to Design and add an HTML/CSS gadget to one of your columns, paste the code, save - and you are done!  (Tip:  Needless to say, you can make more than just 3 buttons. The generator gives you 5 to begin with anyway. However if you have even more than that, simply copy paste the lines from the script and change the image and destination URLs in the added lines.  

Some other nice stuff too on this site by the way, such as a pull down menu generator, a pop-up window maker, a story generator - gotta love this one! :-), lots of image effects, text effects, and and...

http://javascript.internet.com/

.................................................................................................................................

Sunday, 13 March 2011

huge big GUI elements pack

There are some really nice people out there: All WebAlys asks of you is that you link back to the page from where you got these elements. This is a mega pack, containing icons, various types of GUI components, and a styles library for Adobe Illustrator.


The download page is here:
http://www.webalys.com/design-interface-application-framework.php

 (Important:  Once again, remember that if you use any of this the author will have to be credited through a link-back to the above URL.  ) 

...............................................................................................................................
Girls Generation - Korean