# How can i Create this simple navigation

**URL:** <https://forum.kirupa.com/t/how-can-i-create-this-simple-navigation/102403>\
**Category:** Uncategorized\
**Created:** [February 23, 2004, 3:34pm UTC](https://forum.kirupa.com/t/how-can-i-create-this-simple-navigation/102403 "2004-02-23T15:34:26Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![gr0m](https://avatars.discourse-cdn.com/v4/letter/g/54ee81/32.png) [@gr0m](https://forum.kirupa.com/u/gr0m)\
**Post date:** [February 23, 2004, 3:34pm UTC](https://forum.kirupa.com/t/how-can-i-create-this-simple-navigation/102403/1 "2004-02-23T15:34:26Z")

</div>

How can i create such a navigation like here [http://www.beamjive.com/bjc.htm](http://www.beamjive.com/bjc.htm)  
I want to know how can i create following box wich can scale a invert text colours like here (The main thing i want to know is how to create this resizes and follows…)  
And please do not tell me to search the forum, if you know exactly where can i find the same solution to my question, tell me…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [February 24, 2004, 12:12am UTC](https://forum.kirupa.com/t/how-can-i-create-this-simple-navigation/102403/2 "2004-02-24T00:12:23Z")

</div>

yeah that was helpful (collisions; about easing i knew…), but what about resizes of the box?

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [February 24, 2004, 8:34am UTC](https://forum.kirupa.com/t/how-can-i-create-this-simple-navigation/102403/3 "2004-02-24T08:34:01Z")

</div>

You can do it with rollover. set the width and x-position to x and width of your “slide”.  
The colours are done with masking.  
I made you an example:)

scotty(-:
