Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Sticky Header wont work

Featured Lock Resolved Bug
Hi, im using aspasia 1.5.

- joomla and all extensions are actual.
- it does matter if the template set to boxed enabled = sticky header dont work
- Pages which are created with pagebuilder = sticky header dont work
- Itempages, Blog = dont work

I just now installed the helix3 framework and 1.5 aspasia, imported the settings.json
The Sticky Header is active but don't work?

21 Answers

Toufiq - Staff

More than a month ago #Permalink
Hi,

Thanks for your pm. I have fixed your problem. Please check now.

-Thanks

Toufiq - Staff

More than a month ago #Permalink
Hi,

Please share your site url. Let me check, please.

-Thanks

markmark

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!

Toufiq - Staff

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Hi, Thanks for your reply & you are most welcome. Thanks

farew

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Hi, Thanks for your reply & you are most welcome. Thanks


NOTE: Since last Update (yesterday) this needs to be done again to make the sticky header working fine again :(

Toufiq - Staff

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Hi, Thanks for your reply & you are most welcome. Thanks


NOTE: Since last Update (yesterday) this needs to be done again to make the sticky header working fine again :(


Hi, Thanks for your reply. We will try to avoid this issue next update. Thanks

tts

More than a month ago #Permalink
Hi, I am having the same issue and after removing the code, the menu items are hidden at top. Using CSS to change margin just makes it worse as when you scroll down, there is space at top. Also this fix does not fix the sticky header in the mobile devices. How can I fix this? Thank you.

Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Hi, Thanks for your reply & you are most welcome. Thanks


NOTE: Since last Update (yesterday) this needs to be done again to make the sticky header working fine again :(


Hi, Thanks for your reply. We will try to avoid this issue next update. Thanks

Toufiq - Staff

More than a month ago #Permalink
Hi,

Did you remove this code?


// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


-Thanks

tts

More than a month ago #Permalink
Yes I have, once I remove this, my menu gets misaligned to the top. Below is the link of what it looks like once I remove this code. I have tried to edit CSS to margin properly but it doesn't work well because when you scroll down, there is white space.

http://tts.services/elite_roofing/index.php

Toufiq - Staff

More than a month ago #Permalink
Hi, Add this css code inside custom.css code.


.sticky-wrapper #sp-menu {
margin-top: 73px;
}
.is-sticky #sp-menu {
margin-top: 0px;
}


-Thanks

tts

More than a month ago #Permalink
Thank you for that code and it fixed the menu. The logo is also cut off a bit, could you please provide something similar for the logo? I tried to create a similar one but it didn't work.

Also, the menu is not sticking in mobile device.

Toufiq - Staff

More than a month ago #Permalink
Thank you for that code and it fixed the menu. The logo is also cut off a bit, could you please provide something similar for the logo? I tried to create a similar one but it didn't work.

Also, the menu is not sticking in mobile device.


Hi, share an screenshot that you want to do exactly. Thanks

tts

More than a month ago #Permalink
I have attached the issue with the logo. Thanks.

Thank you for that code and it fixed the menu. The logo is also cut off a bit, could you please provide something similar for the logo? I tried to create a similar one but it didn't work.

Also, the menu is not sticking in mobile device.


Hi, share an screenshot that you want to do exactly. Thanks

Attachments (1)

  • issue.jpg
    issue.jpg 397.1 KB

Syed H

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Got me working too. Just had a similar issue and found this one helpful.
Thank you

Syed H

tts

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Got me working too. Just had a similar issue and found this one helpful.
Thank you

Syed H

I have already tried that but it misaligned my menu.

Toufiq - Staff

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Got me working too. Just had a similar issue and found this one helpful.
Thank you

Syed H

I have already tried that but it misaligned my menu.


Hi, Please share your site url. Thanks

tts

More than a month ago #Permalink
Hy,
i remove this in main.js :

// fix conflicting with mootools
if (MooTools != undefined) {
var mHide = Element.prototype.hide;
Element.implement({
hide: function() {
if ($('[data-toggle="tooltip"]').attr('itemprop')) {
return this;
}
mHide.apply(this, arguments);
}
});
}


after no conflict and work!


Got me working too. Just had a similar issue and found this one helpful.
Thank you

Syed H

I have already tried that but it misaligned my menu.


Hi, Please share your site url. Thanks


http://tts.services/elite_roofing/

Toufiq - Staff

More than a month ago #Permalink
Hi,

Thanks for your reply. There is no problem in menu alignment. But, there has problem in logo.

Please add this CSS code inside of your custom.css file


.is-sticky img.sp-default-logo {
margin-top: -20px;
}


-Thanks

tts

More than a month ago #Permalink
OK understood and your css fixed it. Thank you.

Toufiq - Staff

More than a month ago #Permalink
OK understood and your css fixed it. Thank you.


Hi, You are most welcome & Thanks


There are no replies made for this post yet.
Be one of the first to reply to this post!
Sorry, the discussion is currently locked. You will not be able to post a reply or a comment at the moment.

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 130
Toufiq

Toufiq

Total Accepted Answers: 100
Sifat

Sifat

Total Accepted Answers: 63
RV

RAFFAELE VIOLA

Total Accepted Answers: 2
DS

Dustin Swayne

Total Accepted Answers: 1

116

Templates

299714

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us