Joomla Templates Club 406,261 posts

[meziane Friend mezianeJoin date: October 2015Posts: 40Downloads:144Uploads:9 Thanks: 1]

#731375

Dear All,

Can i keep the menu in JA Charity template on top when scrolling?

Thanks!

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#751004

Hi
Kindly share your working site url here.

[meziane Friend mezianeJoin date: October 2015Posts: 40Downloads:144Uploads:9 Thanks: 1]

#751005

Thank you for your reply, But I’m sorry, i am working now on localhost.

[meziane Friend mezianeJoin date: October 2015Posts: 40Downloads:144Uploads:9 Thanks: 1]

#751016

Anybody can send the tutorial or documentation about this?

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#751022

Try This . . .

If you haven’t yet done so, create a new file called “custom.css” within file path –> /templates/ja_charity/css/

Within that custom.css file, paste the following CSS rules:


.t3-header {
background: #ffd733 none repeat scroll 0 0;
color: #ffffff;
padding-bottom: 14px;
padding-top: 50px;
position: fixed;
width: 100%;
z-index: 99;
}

.t3-topbar {
background-color: #333333;
color: #ffffff;
height: 36px;
line-height: 36px;
position: fixed;
width: 100%;
z-index: 100;
}

SAVE CHANGES – CLEAR CACHE- REFRESH PAGE

Better ??

[meziane Friend mezianeJoin date: October 2015Posts: 40Downloads:144Uploads:9 Thanks: 1]

#751090

Thank you for your help.

I fixed it with this code:

I added he js code at the first,

jQuery(window).on("load", function() {
if(jQuery("#t3-header")){
offset_top = jQuery(" #t3-header").offset().top
jQuery(window).scroll(function(){
processScroll("#t3-header", "top-fixed", offset_top);
});
}
});

function processScroll(element, eclass, offset_top, column, offset_end) {
var scrollTop = jQuery(window).scrollTop();
if(jQuery(element).height()< jQuery(window).height()){
if (scrollTop >= offset_top) {
jQuery(element).addClass(eclass);
} else if (scrollTop <= offset_top) {
jQuery(element).removeClass(eclass);
}

}
}

Then i added this code in css:

.top-fixed {
width: 100%;
margin: 0;
position: fixed;
top: 0;
left: 0;
transition: all 1s;
background-color: #2d2f31!important
}

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#751151

As you can see, there are often multiple ways/methods of arriving at any given solution. 🙂

All the best with your continuing site development.

[meziane Friend mezianeJoin date: October 2015Posts: 40Downloads:144Uploads:9 Thanks: 1]

#751155

Thanks a lot!

[Author]

Posts