The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How Can I Make Navigation Bars

View previous topic View next topic Go down

How Can I Make Navigation Bars

Post by Mr DarkHaxers2 on August 24th 2011, 12:53 am

How Can I Make Navigation Bars On The Left Side On My Website

Cause I Really Want To No How To Do It.

I No Some Of HTML Kinda I Do

Please Help Me.

Mr DarkHaxers2
Forumember

Male Posts : 409
Reputation : -17
Language : English
Location : Modesto,Cali

Back to top Go down

Re: How Can I Make Navigation Bars

Post by KingOfSports on August 24th 2011, 2:55 am

You need a program like Photoshop, GIMP, etc to make the images.

KingOfSports
Hyperactive

Male Posts : 2487
Reputation : 38
Language :
Location :

Back to top Go down

Re: How Can I Make Navigation Bars

Post by LGforum on August 25th 2011, 12:23 am

do you mean the sidebar bit? like to the right of this forum?

Because that is found in Modules > Forum Widgets

LGforum
Hyperactive

Male Posts : 2254
Reputation : 254
Language : English
Location : UK

http://www.avacweb.com/

Back to top Go down

Re: How Can I Make Navigation Bars

Post by Mr DarkHaxers2 on August 25th 2011, 12:34 am

No Like When U Hover Over The Navigation It Slides Open To See The Stuff.

Mr DarkHaxers2
Forumember

Male Posts : 409
Reputation : -17
Language : English
Location : Modesto,Cali

Back to top Go down

Re: How Can I Make Navigation Bars

Post by KingOfSports on August 25th 2011, 3:15 am

That requires serious CSS code-ing...look it up on google.

KingOfSports
Hyperactive

Male Posts : 2487
Reputation : 38
Language :
Location :

Back to top Go down

Re: How Can I Make Navigation Bars

Post by ioncube on August 25th 2011, 4:36 pm

no need for serious css coding; slide buttons are very easy to implement:

css part:
Code:
.flt-wdt{
position:fixed;
margin-right:10px;
right:0;
top:40%;
}
.flt-wdt img{
float:right;
clear:right;
margin:5px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.flt-wdt img:hover{
-moz-transform: scale(1.2) rotate(6deg);
-webkit-transform: scale(1.2) rotate(6deg);
-o-transform: scale(1.2) rotate(6deg);
-ms-transform: scale(1.2) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg);
transform: scale(1.2) rotate(6deg);
}

add this html code (with custom images/link) via a widget at any place:


Code:
<div class="flt-wdt">
<a href="http://www.facebook.com/pages/DefenceDog/183379545033991" target="_blank" title="Follow Me on Facebook"><img alt="Follow Me on Facebook" src="http://i54.tinypic.com/zwdwko.jpg" /></a>

<a href="http://twitter.com/defencedog" target="_blank" title="Follow Me on Twitter"><img alt="Follow Me on Twitter" src="http://i56.tinypic.com/z7tz5.jpg" /></a>

<a href="http://feedburner.google.com/fb/a/mailverify?uri=Defencedog&amp;loc=en_US" target="_blank" title="Subscribe to DefenceDog by Email"><img alt="Subscribe to DefenceDog by Email" src="http://i52.tinypic.com/se57r8.jpg" /></a>

<a href="http://feeds.feedburner.com/Defencedog" target="_blank" title="Subscribe to RSS"><img alt="Subscribe to RSS" src="http://i56.tinypic.com/1z498wo.jpg" /></a>


</div>

they will appear like this http://defencedog.blogspot.com/

ioncube
Forumember

Male Posts : 279
Reputation : 41
Language : eng
Location : Pakistan

http://defencedog.blogspot.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum