How to make a navigation bar overlap a banner image

Whilst trying to code a website for a class project, I came across an issue. I would like to have my nagigation bar overlap my banner image, like you can see on this webpage http://blindbarber.com/ and I was wondering how I would go about doing that. I'm not even sure where to start with doing it, as every time i attempt to make it work, all it does is push the rest of the webpage down.
I'm using Dreamweaver CS4, and if you need to see any of my code, just let me know
Thanks in advance

Without getting into all the effects used on the site you linked above, simply create your menu container and apply an overall  background image behind your menu with CSS
background: #fcf url(images/menubg.jpg);
If on the other hand, you want images within your menu itself, this tutorial is particularly helpful in showing exacly where to apply the images.
http://etuts.org/add-background-image-color-to-thesis-navigation-menu/
And yes, seeing your code is invaluable, and by far the best way to do this is to upload your work on a server,
We usually need to see ALL your files to solve your issue quickly and accurately without a lot of guessing and questions back-and-forth.
Just rename a copy of your problem page  (such as "test.html")  and upload it to your server (with any associated files) in whatever folder the original page was located, and simply post a link in the Forum and tell us your problem.
This saves you having to cut and paste miles of code into the Forum for the page and all the dependent CSS, JS etc. files.and saves us from having to recreate all your files, find your images and then repair your code and test the solution for you.
I trust this is helpful.

Similar Messages

  • Is their any tutorials on how to make a navigation bar with drop downs in Dreamweaver CC now ?

    Is their any tutorials on how to make a navigation bar with drop downs in Dreamweaver CC now that they do not have the spry option?

    bbull2005 wrote:
    Preran, why wouldn't Dreamweaver include it's own menu/navigation bar widget?
    I can't answer on Preran's or Adobe's behalf, but I think you'll find at least part of the answer here: http://wiki.jqueryui.com/w/page/38666403/Menubar
    Adobe decided to discontinue development of Spry in August last year, and Dreamweaver CC made the switch to using jQuery UI widgets and effects. One reason for dropping Spry was that it failed to work correctly in some browsers. Judging from the fact that the jQuery UI menubar is now "on ice", creating a flyout menu that works reliably across all devices is proving more difficult than originally envisaged.
    Because all other widgets in Dreamweaver CC use jQuery UI, it's a reasonable assumption that Adobe hoped the jQuery UI menubar would be ready in time, but it wasn't.

  • How to make a navigation bar with buttons that stay highlighted

    I have Dreamweaver MX 2004. I know how to make a simple nav
    bar, but how do you make it so it's like the Apple website, with
    buttons that stay highlighted on the appropriate page?

    "[email protected]" <[email protected]>
    wrote in message
    news:gd04sb$5mc$[email protected]..
    >I have Dreamweaver MX 2004. I know how to make a simple
    nav bar, but how
    >do you make it so it's like the Apple website, with
    buttons that stay
    >highlighted on the appropriate page?
    http://divahtml.com/products/divaGPS/current_menu_location.php
    Thierry
    http://www.TJKDesign.com/go/?0
    | Articles and Tutorials
    http://divahtml.com/products/scripts_dreamweaver_extensions.php
    | Extensions
    that keep your markup clean
    http://www.fourlevel.com/ |
    CSS Menus, Gallery, Tab Panels, etc

  • How to find the navigation bar at the apps, PDF reader Lite? after i zoom in, the navigation bar dissapear~ what should i do to make the navigation bar reappear?

    How to find the navigation bar at the apps, PDF reader Lite? after i zoom in, the navigation bar dissapear~ what should i do to make the navigation bar reappear?

    Hello,
    Yes it will be in your page template. You just need to move #NAVIGATION_BAR# substitution under the #LOGO# substitution tag, probably something like this should work
    #LOGO#&lt;div>#NAVIGATION_BAR#&lt;/div>
    Carl

  • How to make a scroll bar!!!

    i need to know how to make a scroll bar in flash cs3! can
    anyone help me with this??

    http://learnola.com/2008/10/27/flash-tutorial-create-a-custom-scrollbar-with-actionscript/

  • How to make a slide bar that controls opacity

    I'm trying to figure out how to make a slide bar that would control opacity. If I were to take to pictures on top of each other, the slide bar would control the opasity of the top image. Thanks

    can you make a slider that controls anything?  if so, what's the range you can control?
    ie, when the slider is at one extreme it causes some object to have value1 and when it's at the other extreme the object has value2.  what value1, value2 can you handle?

  • How to create a navigation bar with custom made buttons?

    I'm used to work with a similar program as Muse. In there we can create a single button and link them together into a navigation bar. I have tried all sorts of tutorials but none of them is discussing this possibility.
    To summorize. The idea is to create a button in photoshop and to use this as a theme to build a navigation bar. Possible or not and how? Thanks for assistance. Rgds Rufin

    Hi Brad,
    Thanks for your reply.
    No, not really. I used to work with XARA up till now. And being an Adobe Cloud user I think it a bit silly using two different systems. In XARA I can create a custom button and turn them into a navbar. For your information I include a few links to sites I created with Xara and I would like to know if I can create the same type of navbars with Abobe Muse. I already found out that all the other functions are available and some work a lot better in Muse, but I’m stuck on the navbar issue. I know I can create a button in Adobe PS and use it in Muse. But I didn’t manage to figure out how to create a navbar in Muse on basis of a button created in PS.
    www.restaurant-cedric.be or www.discoamigo.com or www.radioparadijs.be
    Grtz,
    Rufin
    LOGO-RUFIN'S-REISBUREAU-outlook
    Koningslaan 36 – b31
    8300 Knokke – Heist
    Tel: 050621052
    Fax: 050621072
    e-mail:  <mailto:[email protected]> [email protected]
    <http://www.rufins.be/> http://www.rufins.be
    <http://www.travelcoop.be/> travelcoop_logo_2013[1]  <http://ferventreisagent.be/rufins-reisbureau> klein logo
    Van: Brad Lawryk
    Verzonden: zondag 12 oktober 2014 19:40
    Aan: RUFIN DUWEL
    Onderwerp:  How to create a navigation bar with custom made buttons?
    How to create a navigation bar with custom made buttons?
    created by Brad Lawryk <https://forums.adobe.com/people/Brad+Lawryk>  in Help with using Adobe Muse CC - View the full discussion <https://forums.adobe.com/message/6817739#6817739>

  • How to make an app a file receiver for images on iOS?

    Hi,
    How to make an app a file receiver for images on iOS?
    I did it for the Android app.xml like this:
    <intent-filter>
            <action android:name="android.intent.action.SEND"/>
            <category android:name="android.intent.category.DEFAULT"/>
            <data android:mimeType="text/plain"/>
        <data android:mimeType="image/jpg"/>
        <data android:mimeType="image/jpeg"/>
        <data android:mimeType="image/png"/>
        <data android:mimeType="image/gif"/>
    </intent-filter>
    How to do it for iOS?
    (I'm using Adobe Air 4.0)
    Thank you!

    What app have you used to create your ibook?  Normally any app will have a menu item like File > Export that will give you the option of PDF, or you can use Print and there will be an option in the Print dialogue to Print to PDF.

  • How do i make a navigation bar for all pages

    Hi friends !
    I want the same navigation bar to appear on all the web pages of my website. (As these are the common things that all the webpages will have). But I didn't find any option to use the navigation bar as a template.
    Will I have to copy and paste the same navigation bar on all the pages (let's say 50 to 60 pages, I will have). It will be very tiresome and tedious job to do.
    And also if I make even a minor change in the navigation bar then I will have to change it in all 50-60 pages.
    What should I do ?
    Please help me in this regard.
    Imagine a 100 or 200 page site, perfectly functioning and on the air. Then, one day, you need to add or delete some button, or simply change a link. You need to change the menubar in ALL 200 pages, and then re-publish them all. Quite a work, ah ?
    Regards,
    Jtechmiami

    Although Dreamweaver Templates and Library items are suitable tools for doing this, they're tedious and cumbersome at best. They get old very quickly.
    By far the most efficient method is to set your navigation bar up as a Server Side Include (SSI).
    SSIs are not Dreamweaver specific, they're a general web technology available on any server.
    A good primer here
    http://www.projectseven.com/products/menusystems/pmm2/ug-examples/includes/index.htm
    Do you already have a hosting account? Does it have PHP available?
    jtechmiami wrote:
    Imagine a 100 or 200 page site, perfectly functioning and on the air. Then, one day, you need to add or delete some button, or simply change a link. You need to change the menubar in ALL 200 pages, and then re-publish them all. Quite a work, ah ?
    Not with SSIs. Simple sitewide menu updates take a few seconds.
    You edit a single text file locally (either button labels or a CSS rule for styling the button), upload (1-2 seconds) and every page on the site is instantly updated.
    Much better than DW Templates.

  • How to make fix navigation for single page w/ horizontal slider

    I've created a horizontal sliding page with the use of anchor but i cant fix my navigation bar, can someone help me how to make it?
    like this site http://www.selvagreenng.com/#abt
    thank you very much

    any help please? i will appreciate it a lot.

  • How to make the status bar transparent

    can anyone help?

    Here it don`t make the status bar transparent...
    I`m trying to make UINavigationBar transparent too like Photo App and trying it but get nothing:
    [navigationController.navigationBar setBarStyle:UIBarStyleBlackTranslucent];
    [navigationController.navigationBar setTintColor:[UIColor colorWithWhite:0.2 alpha:0.6]];
    Some other idea how they do this? An application called Style.com do the same..
    Thank you

  • How do I change navigation bar text color?

    I want to change the color of the type in the navigation bar, as well as the line/bar below the type. How can I do this?

    there are many way to change navbar look-and-feel:
    1) by changing template XML, this requires XML knowledge and is a complex process.
    2) by changing navbar CSS in page source, this a bit easier but requires post editing.
    http://discussions.apple.com/thread.jspa?messageID=5186688&#5186688
    3) by javascript, this requires CSS and javascript knowledge:
    http://discussions.apple.com/thread.jspa?messageID=8638743&#8638743
    4) by manually build your own navbar as roddy and ot mentioned, this requires no knowledge of any kind but it is not very efficient; see my post here:
    http://discussions.apple.com/thread.jspa?messageID=8136472&#8136472
    5) by AJAX, this requires CSS, javascript and AJAX knowledge; I outlined it in my blog here:
    http://www.cyclosaurus.com/Home/CyclosaurusBlog/Entries/2009/9/10iWeb_NavBarWidget.html

  • How to make a navigation for a scroll-down website?

    Hello, I created a one-page website, where you need to scroll down to see the different types of content.
    But how do I add a navigation on it?
    As example, the "About" part is somewhere in the middle of the page, how can I make a navigation which will scroll down automaticly to the "About" part when I click on it?
    I think you know what I mean.
    Greetings

    Use anchor links for the purpose - http://tv.adobe.com/watch/muse-feature-tour/muse-create-anchor-links/.
    Also check this out - http://www.musegrid.com/adobe-muse-tutorials/how-to-use-anchors-for-smooth-scrolling-singl e-page-designs-with-adobe-muse.
    Thanks,
    Vinayak

  • Can someone please help me make this Navigation bar in Javascript please

    Hi I love this Navigation bar :   http://en.wordpress.com  I have struggled trying to find tutorials or anything just to try and make it, If someone could make it, I would LOVE IT! I am finding it way to hard just to find help. So please could someone kindly help me out.   Thank you so much!

    What exactly is it you like about that element? It's not really a navigation element, it's just a single link in a <header> tag -
    <header class="wpcom-header" role="banner">
                        <div>
                                  <h1 class="wpcom-title"><a href="//en.wordpress.com/">WordPress.com</a></h1>
                                  <nav id="wpcom-navigation" class="main-navigation" role="navigation">
                                            <h3 class="menu-toggle">Menu</h3>
                                            <div class="menu-main-container">
                                                      <ul id="menu-main" class="nav-menu">
                                                                <li id="nav-signin"><a class="nav-highlight" href="#home-signin">Sign In</a></li>
                                                      </ul>
                                            </div>
                                  </nav>
                        </div>
              </header>
    It's styled with CSS to look the way it does.

  • How to make HDivide Box Bars clickable?

    Does anyone know how to make the bars of a HDivide box click
    able so I can collapse or open the children. Basically when clicked
    I want to collapse the bars and change the bar image and then if
    it's closed have it open... Similar to Editing tools in windows
    applications. Any examples or help would be appreciated

    Be sure that you have assigned the button covering the stage
    the instance name "clic"
    Also, to cover all bases, you will be better off to approach
    the code using strict AS3...
    var url:String = "
    http://hartkopfconstruction.com";
    var request:URLRequest = new URLRequest(url);
    function clicked(e:MouseEvent):void{
    navigateToURL(request);
    clic.addEventListener(MouseEvent.CLICK, clicked);
    Sorry, but I don't personally know any good Flash books. I've
    done most of my learning by doing (trying) and searching for
    solutions when I need them. If you search the forum you may find
    some recommendations. I've seen this question a few times.

Maybe you are looking for