Jump to content


Photo
- - - - -

Inserting Nav Bar On Feature Slider


  • Please log in to reply
9 replies to this topic

#1 sunit333

sunit333

    Newbie

  • Members
  • 7 posts
  • Framework Version:2.3
  • Country: Country Flag

Posted 28 November 2012 - 04:19 PM

Hi,

 

I am trying to create a website just similar to www.mnuaysilpa.ac.th    how can i put the navbar and make it transparent just like on that website. Please help the NAV bar also says its transparent but it is blac. Also the current NAV bar requires a click for the drop down and not can i make it look like the one on mnuaysilpa.ac.th   Please advise as my project is near completion but this is the major change the client has requested.



#2 batman

batman

    Bat Learning

  • Members

  • 2167 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 28 November 2012 - 04:25 PM

Hi

If I understand (It is impossible to access the live URL) 

 

You can use de Nav Classic with the "Simple CSS Lite" plugin found in the PageLines Store to change all parameters.

It's a free plugin that allows you control over the color of the menu.

Simple CSS Lite only works on the standard navigation, it don´t work on NavBar.

Also this Nav don´t need click to drop down.



#3 sunit333

sunit333

    Newbie

  • Members
  • 7 posts
  • Framework Version:2.3
  • Country: Country Flag

Posted 28 November 2012 - 08:24 PM

Thanks for the reply. It is definitely possible to access the url www.www.mnuaysilpa.ac.th   The nave bar is what i want to copy on to my website. How should i go about it? i want the navigation on the feature slider it self. I also need the navigation to be transparent and on hovering the mouse over it, i need the drop down to appear with a color i choose. I installed "Simple CSS Lite" but i doubt i am reaching anwhere near achieving this effect. Also if any one knows the transition effect of the slider then it would be helpful. 



#4 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 29 November 2012 - 01:11 AM

Hi there, I can't get onto that link either. 

 

From your description you'd need to place the nav above/below the item in the drag and drop and then use css to align the nav into the position you want by adjusting the margins and padding.

 

You'd also need to use css to remove the background image/color to the navbar.

 

You can find out more about css here

Please Login or Register to see this Hidden Content

You'll need firebug to find the selectors you'll need to edit, you can download that from www.getfirebug.com



#5 sunit333

sunit333

    Newbie

  • Members
  • 7 posts
  • Framework Version:2.3
  • Country: Country Flag

Posted 29 November 2012 - 09:42 PM

Thanks but I am afraid firebug isnt helping in my case. I have attached the screen shot for what I would like to achieve. I would want to put a transparent menu on the feature image slider like shown on the screen shot. Not under and not above therefore drag and drop isnt helpful in my case. Is this possible? Please re try the link 

Please Login or Register to see this Hidden Content

  and see what I would want to achieve.

 

Thanks 



#6 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 29 November 2012 - 11:23 PM

Hi, yup drag and drop isn't going to help you achieve this effect unfortunately, it will have to be a custom css solution applied to the navbar will apply a negative margin to move the navbar into the correct postion.

 

However if you don't want to use coding, there might be a solution in the wicker plugin. This allows you to put a navbar inside the slider as described. Check it out at

Please Login or Register to see this Hidden Content



#7 sunit333

sunit333

    Newbie

  • Members
  • 7 posts
  • Framework Version:2.3
  • Country: Country Flag

Posted 01 December 2012 - 09:24 AM

Hey James, jsut wanted to let you know that the author of wicker has informed me that i cannot not have my desired effect with wicker    

Please Login or Register to see this Hidden Content

 

 

Also do let e know how I can achieve a transparent drop down menu with the current branddnav and any other suggestions you may have other than wicker.

 

Thanks



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 01 December 2012 - 06:21 PM

I may be misinterpreting your desires here, so please forgive me.

 

For a background slider, I'd suggest:

Please Login or Register to see this Hidden Content

 

For the opacity of the drop down menu, allowing it to be partially visible, you'll need a custom CSS solution. I can guide you to this:

Please Login or Register to see this Hidden Content

 

It may prove helpful.  You can also view the CSS for your menu using RGBA in Firebug by clicking the Style tab over the CSS area. Then, you can apply opacity to the RGBA color of your menu element.   Lastly, you can also implement the menu drop down background with semi-transparent images.  See this:

Please Login or Register to see this Hidden Content



#9 sunit333

sunit333

    Newbie

  • Members
  • 7 posts
  • Framework Version:2.3
  • Country: Country Flag

Posted 01 December 2012 - 09:51 PM

Thanks for the info Rob, I need to achieve the nav bar effect like on the website 

Please Login or Register to see this Hidden Content

   It has got the NAV bar on the transition itself. The mouse over action brings the drop down which is transparent. This is exactly what I am tryin to achieve for my website. Been having sleepless nights trying to achieve this. Some one please look into it and help me out here.  currently with pagelines the closest I am getting is just placing the NAV bar above the feature slider for my home page. The BrandNAV option is leaving a lot of space and the home page is not looking good at all. Please visit my link      its a live link i am working on. Thanks in advance



#10 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 01 December 2012 - 10:21 PM

I understand that you'd like to have the transition in the Brandnav, with the Nav contained within the slide, however, this isn't something PageLines provides. It is a customization performed for the site you linked. 

 

The best I can do is recommend the slider and CSS customization.  I do not know of any sliders that include the menu and exist outside the scope of a section.   The solutions I found are the very best there are.   If you need something more specific, we provide development professionals at an additional cost.