Jump to content

Archived

This topic is now archived and is closed to further replies.

kellid

Make canvas background image extend to the nav

Recommended Posts

kellid

Hello,

 

Is there a way to make the background image of the canvas section (not in the header) in the top of the template section extend to be the background of the nav menu as well?  When scrolled, the nav would change to an opaque color but remain at the top of the page.  Here is an example...

 

http://www.kutikai.com/#!home

 

Thanks in advance!

 

Kelli

Share this post


Link to post
Share on other sites
Danny

Hi,

 

The website you linked just gives me a spinning loading icon and doesn't appear at all, regardless of how many times I refresh the page. Therefore, I am unable to see what it is you're trying to achieve.

 

However, if I assume you want to place a navigation section in the template region of your page and have it so that the nav background is transparent, is this correct ?

If so, you're going to need to use custom CSS on the nav section, giving it a transparent background.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
pehja

How do I target the Navi section to do this 

.section-navi {
color: transparent;
}

All this did was to remove the font color?


Professionell musician | Webbdesigner | Apple freak

Pehja Production.png

Share this post


Link to post
Share on other sites
Danny

pehja - color: transparent; will make the text invisible, as color is for text color ? I am not sure what your issue, is the class you have used to target the navi section is correct.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
pehja

Yes I know but when I use .section-navi {

background-color: transparent;
}
 
The section is still white?
 
I want to accomplish this http://www.kutikai.com/#!o-nas
 

Professionell musician | Webbdesigner | Apple freak

Pehja Production.png

Share this post


Link to post
Share on other sites
Danny

Thats because the background-color property is loaded from the fixed-top element not the section-navi.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
kellid

[attachment=2479:Transparent Nav.jpg]Hi DAnny,

 

Thanks for your response.  Can you view the image attached or the link to the example site? 

 

To be clear, I would need to add a nav section to the template section on each page (all pages have different templates) and use CSS to achieve transparency/opaque?  

 

Thank you!

Share this post


Link to post
Share on other sites
Danny

If you add a Nav section to the header region, you will not need to add a different section on each page.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Danny

No problem.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • jlsc
      By jlsc
      Hey,
       
      I removed the Facebook and RSS icons from my header and it caused my nav menu to get out of sorts. I realize something else might have caused this nav issue, but the only thing I can correlate was the removal of these icons. Can you give me an idea of how to get my nav bar straightened out? (www.makeanddogirl.com)
       
      Thanks!
       
      Jess
    • spacle2xl
      By spacle2xl
      Okies! Good day all... I have attached a screenshot of what I want to achieve, though don't know how to go about it. On the Primary navigation bar - main menu, I want to replace the 'Home' link with a small image - icon. Please I appreciate any contributions/help. Thanks
×