You have 0 items in your cart

Log In or Create Account

 
Free Web site icons since 1994
HTML Tips for QBullets

It’s best to place the QBullet inside the hypertext link (i.e., before the </a> tag), so that the user can click either the text or the QBullet with identical results. When you do this, be sure to set the border parameter to 0.

When QBullets are placed next to standard 12 point text, it works best if you set the alignment to absmiddle. You should also include the height and width parameters so that your page will display more quickly.

Following these guidelines, the HTML Code for:

Matterform Media

would look like this:

<a href="http://www.matterform.com">Matterform Media <img align=absmiddle border=0 width=11 height=11 src="remote.gif"></a>

Generally, you don’t want to put any space between the text and the QBullet. If it looks like a QBullet is too close to the last letter of the link, you can add a pixel of breathing room by inserting hspace=1 into the QBullet’s <img> tag.

Animated QBullets

To insert a continuously animated QBullet, simply make the image’s SRC point to the animated version of the QBullet. The HTML Code for:

Matterform Media

would look like this:

<a href="http://www.matterform.com">Matterform Media <img border=0 align=absmiddle src="remote_a.gif" width="11" height="11"></a>

To insert a rollover animation, you need to use some JavaScript. You must give the QBullet image a unique name that you reference in the JavaScript. The code for:

Matterform Media

would look like this:

<a href="http://www.matterform.com" onMouseOver="document.images[‘qb0’].src=‘remote_a.gif’;" onMouseOut="document.images[‘qb0’].src=‘remote.gif’;"> Matterform Media<img border=0 align=absmiddle src="remote.gif" width="11" height="11" name="qb0"></a>