BullGuard Antivirus Sale - 60% Off with openElement !
Forum openElement Homepage
Forum Home Forum Home >

openElement

> openElement General Discussion
  New Posts New Posts RSS Feed - Sticky element
  FAQ FAQ  Forum Search   Register Register  Login Login

Sticky element

 Post Reply Post Reply
Author
Message
b-rent$ View Drop Down
Groupie
Groupie
Avatar

Joined: 02 Juin 2015
Location: Austin
Status: Offline
Points: 48
Post Options Post Options   Thanks (0) Thanks(0)   Quote b-rent$ Quote  Post ReplyReply Direct Link To This Post Topic: Sticky element
    Posted: 16 Mar 2020 at 21:02
I was hoping to make two link elements that are stuck to the bottom of the page while scrolling.  Kind of like the opposite of a menu bar at the top.  I have tried duplicating the menu bar, but couldn't figure how to get it to stick to the bottom.  I have tried adding a sticky element, but it just appeared after the footer.  Sorry I am not better at this.  Certainly feel like I am wasting peoples time a little, but I coudn't find anything in other discussions that helped.

Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: 05 Juin 2018
Location: Canada, Québec
Status: Offline
Points: 4595
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: 18 Mar 2020 at 01:19
Hello, 

There is a way to use a group of elements and to force it to stay on top of everything and to stick at the bottom of the screen, is it what you are asking for?


Anyone who wants to put something on line gets hooked by something big
Back to Top
b-rent$ View Drop Down
Groupie
Groupie
Avatar

Joined: 02 Juin 2015
Location: Austin
Status: Offline
Points: 48
Post Options Post Options   Thanks (0) Thanks(0)   Quote b-rent$ Quote  Post ReplyReply Direct Link To This Post Posted: 19 Mar 2020 at 03:18
Yes

Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: 05 Juin 2018
Location: Canada, Québec
Status: Offline
Points: 4595
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: 19 Mar 2020 at 10:50
Do you understand that if your page is longer than the screen used to view it, your content will be overlapped by this group of elements?

Edited by Hobby001 - 19 Mar 2020 at 14:23
Anyone who wants to put something on line gets hooked by something big
Back to Top
b-rent$ View Drop Down
Groupie
Groupie
Avatar

Joined: 02 Juin 2015
Location: Austin
Status: Offline
Points: 48
Post Options Post Options   Thanks (0) Thanks(0)   Quote b-rent$ Quote  Post ReplyReply Direct Link To This Post Posted: 23 Mar 2020 at 02:41
yes, I want it to be on top of everything like the menu bar at the top of the page, but at the bottom of the page instead.  I want it to stay right there at the bottom as you scroll through every page.
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: 05 Juin 2018
Location: Canada, Québec
Status: Offline
Points: 4595
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: 26 Mar 2020 at 13:29
Sorry for the delay, COVID-19 required my attention elsewhere

Ok, here is the trick:

Make sure that your page footer is configured for Position absolute


Add a group of elements in your page footer with all the required content

Create a new Endbody Javascript Source Code block in your page 

Add the following code in it

$(document).ready(function(){$('#WE93090a546c').css({'top':$(window).height()-$('#WE93090a546c').height(), 'position':'fixed'});});
$(window).resize(function(){$('#WE93090a546c').css({'top':$(window).height()-$('#WE93090a546c').height(), 'position':'fixed'});});

Last thing, replace WE93090a546c with your own group of elements ID




Edited by Hobby001 - 26 Mar 2020 at 13:31
Anyone who wants to put something on line gets hooked by something big
Back to Top
Hobby001 View Drop Down
Admin Group
Admin Group
Avatar

Joined: 05 Juin 2018
Location: Canada, Québec
Status: Offline
Points: 4595
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hobby001 Quote  Post ReplyReply Direct Link To This Post Posted: 26 Mar 2020 at 13:33
P.S.  

To make sure that your group of elements sticks to the left side of your screen

$(document).ready(function(){$('#WE93090a546c').css({'left':0,'top':$(window).height()-$('#WE93090a546c').height(), 'position':'fixed'});});
$(window).resize(function(){$('#WE93090a546c').css({'left':0,'top':$(window).height()-$('#WE93090a546c').height(), 'position':'fixed'});});


Anyone who wants to put something on line gets hooked by something big
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 10.11
Copyright ©2001-2012 Web Wiz Ltd.

This page was generated in 0,031 seconds.