maybe this tutorial can help you a bit http://www.eobasi.com/2013/06/css-oxwall-sign-in-button-with-hover.html 

thanks man, i edited my post

did this help 

Well no because the dialog box I want to show is not that one but the one hidden in the page the one for Sign in redirects differently

Omari, the solution depends on how you developed the custom sign-in button and what version of the oxwall software you are using.

If you are using 1.5.3 software version and created the custom button using our standard functions described in /ow_system_plugins/base/classes/console_event_handler.php file - you should simply describe the custom button in the collectItems function as it developed for the the standard sign-in button.

If you are using the older version - you should update the software or check the 1.5.3 version to see how it works there and implement it to your site.

Daisy, the button is simply me adding an html link <ahref>. with html and css

What i want to achieve is by clicking this link i can bring up the sign in form, however I dont know php or java I can only edit html and css hence my limitations.

I notice on the join page the sign in form is wrapped in a div and set to display:none. Since i can't find the div anywhere, and it doesn't have a class I'm guessing its applied with javascript. 
So alternatively I would like to show this hidden display form by default. The ones that resides in join_index.html

Omari, to add the button to the console it's not enough to simply add a html code of the button, it requires the php programming. If you are not familiar with the code modifications, it would be better for you to find a developer who can help you with it.