Youjoomla Support Forums - Fixed top menu on scrolling the page

Youjoomla Support Forums (https://www.youjoomla.com/joomla_support/index.php)

- Baseline (https://www.youjoomla.com/joomla_support/forumdisplay.php?f=256)

- - Fixed top menu on scrolling the page (https://www.youjoomla.com/joomla_support/showthread.php?t=13940)

michy80

09-18-2015 04:54 AM

Fixed top menu on scrolling the page

Hi,
i have a local website (that will be published on Internet when finished) and i would like to know how to make a fixed top menu when scrolling down the page so that it will be always visible for the user.
I tried to find the solution on your documentation about sitcky and in the forum posts but i didn't found it.
Could you help me please?
Thank you!

Are you sure your are posting in product assigned forum?: Yes

What is your CMS version?: Joomla 3.x

MySQL Version: 5.x

PHP version: 5.x

Link to installation: local installation

Have you edited any files? If yes tell us which ones.: No

Is this personal or client website?: Personal

arefund

09-18-2015 08:06 AM

Hello michy80.
Please check this forum thread might help you out.
http://www.youjoomla.com/joomla_supp...ad.php?t=13280

michy80

09-18-2015 08:50 AM

Hi Arefund,
and thank you for your answer.
I followed the guide and tried to apply that changes but top menu does not appear fixed on scrolling down the page. The only things that appear are "Go to top" "Go to scroll 1" etc.
I would like to do something like attached image.
Have you got some other advices?
Thank you.

arefund

09-21-2015 07:35 AM

Menu in Baseline template is already in header position.
You have to add the sticky effect and holder to your index.php file.
Right now you can see this http://prntscr.com/8irycu inside your index.php file, you can add the sticky like this:

Code:

<div class="sticky_holder">

<?php require( YJSG_HEADERBLOCK );/* header - header grid */?>

<?php  if($topMenuLocation == 0 ){ /* if topmenu location is inside the header we dont need it here */

 require( YJSG_TOPMENU );/* top menu */

}

?>

</div>

div class sticky_holder needs the sticky effect http://www.yjsimplegrid.com/add-ons/sticky.html

michy80

09-30-2015 06:02 AM

Hi arefund,
I'm sorry for my late answer.
I've tried to do what you write in your last post but i did not succeed in doing what i wanted to: top menu did not appear. What appear is "I will become a sticky once you scroll 500px down."

arefund

10-01-2015 07:29 AM

That is because you added the example code line:

Code:

<div class="yjsgsitew"> I will become a sticky once you scroll 500px down.</div>

You have to add this part:

Code:

class="yjsg-sticky" data-hide="no" data-pushed="0" data-offset="500" data-effect="slide">

to the div that is holding your menu.

All times are GMT -4. The time now is 03:57 PM.