It will be my first thread here. And I am sure that it won't be the last since I am trying to learn web design to fill my spare time with something that I wonder about.
I am sketching the layout of my upcoming web page. The thing that I want is to have a navbar which will slide (move) left and right, let's say for 5 seconds and return to it's first position. It will slide left and right whenever someone clicks on any navigation link of navbar. This navbar will be fixed to the top of screen.
I do not know much about scripting language, and will be very thankful if anyone has any idea on how to accomplish that.
It is not very clear what exactly behavior of navbar you want.
Anyway it is not a complicated trick... You need to have the main container element of navbar absolutely positioned (style position absolute) and change its position with a timer. There are half-ready solutions for such animated effects in jQuery (it also allows you to avoid compatibility problems), but anyway you need to have some practice/experience with "scripting languages".
It will give the effect of printer head. Imagine how the head of a printer moves left and right while printed paper comes out. The Navbar will be a rectangular shape at the left-top of the screen, and on this rectangular i will place 4 links to provide the navigation to other pages below. When you click any of those links the rectangular navbar will slide to the right of the page and come back and stop where it started. (several times) The general idea of my page will be single-page website.
I have not published it yet. I will post the link when the main structure of the page is ready.
The navbar will be fixed to the top in order to be stable while the content pages slide from top to the bottom (single-page website).
Thanks for the tip. I am working on JQuery scripts right now.
I am currently having a problem with changing the element of <ul> tag. When I inspect my page I can see the code;
<ul style="width: 2748px; ">
When I open this page with notepad or other html editors, I can't see the "style" attribute and change it. I tried to add external CSS to change it but no way... It is still the same... Has anyone of you run into this kind of problem?