Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. General Discussion
  3. Sticky position with jQuery

Sticky position with jQuery

Scheduled Pinned Locked Moved General Discussion
7 Posts 3 Posters 1.7k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • R
    R
    raphael75011
    wrote on last edited by
    #1

    Re: Text Element Sticky: stick to top on scroll

    Hello,

    I am using a javascript fonction that I found on the forum to
    use a sticky position on a block of text. It is working but not totally. When you scroll up there is a bug, as you can see here: http://wcnhxpk.cluster028.hosting.ovh.net/projet-1
    Do you have a solution to fix it?
    Thank you so much,

    Raphaël.

    1 Reply Last reply
    0
    • RichardR
      RichardR
      Richard
      Global Moderator
      wrote on last edited by
      #2

      Dear @raphael75011

      I believe i can see it :)
      but just to be correct it is obviously because it jumps right?

      The Class "Sticky" is only being added when you leave the top of the page, something about it being completely '0' to the top causes the problem but as soon as move - it kicks into action!

      Is there anything in your Javascript you can see at first glance that could be causing this? or any Solution you see easily?

      Best wishes and thank you for using Lay Theme

      Sincerely
      Richard

      1 Reply Last reply
      0
      • R
        R
        raphael75011
        wrote on last edited by
        #3

        Hi @Richard-Keith

        Thanks for your kind answer. I have some notion of html/css unfortunately I don't know how to write javascript. Here is the function, maybe you know more than me.
        Best,

        Raphaël.

        <script>

        jQuery(document).ready(function($) {

        function sticky()
        {
            var window_top=$(window).scrollTop();
            var top_position=$('body').offset().top;
            var element_to_stick=$('#header');
            
            if (window_top > top_position) {
                element_to_stick.addClass('sticky');
            } else {
                element_to_stick.removeClass('sticky');
            }
        }
        $(window).scroll(sticky);
        sticky();
        

        });
        </script>

        1 Reply Last reply
        0
        • RichardR
          RichardR
          Richard
          Global Moderator
          wrote on last edited by Richard
          #4

          Dear @raphael75011

          Hi Raphael sorry for the late reply

          Do you still need help with your problem?
          Remember when using JS that we have to change the " $ " to " jQuery "

          Thank you for your patience and apologies once again

          Sincerely
          Richard

          1 Reply Last reply
          0
          • S
            S
            Sophie1000
            wrote on last edited by
            #5

            Hi @raphael75011 does it work for you ?
            I'm using the same jQuery function and to change the $ to jQuery doesnt seems to change anything.

            1 Reply Last reply
            0
            • RichardR
              RichardR
              Richard
              Global Moderator
              wrote on last edited by
              #6

              Dear @Sophie1000

              Am i correct from your recent Thread this is solved?

              http://laythemeforum.com/topic/6672/sticky-element?_=1616638900292

              Best wishes

              Richard

              S 1 Reply Last reply
              0
              • RichardR Richard

                Dear @Sophie1000

                Am i correct from your recent Thread this is solved?

                http://laythemeforum.com/topic/6672/sticky-element?_=1616638900292

                Best wishes

                Richard

                S
                S
                Sophie1000
                wrote on last edited by
                #7

                @Richard yep, thank you :)

                1 Reply Last reply
                0

                Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                With your input, this post could be even better 💗

                Register Login
                Reply
                • Reply as topic
                Log in to reply
                • Oldest to Newest
                • Newest to Oldest
                • Most Votes


                Online Users
                L
                lukas123
                Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
                laytheme.com
                • Login

                • Don't have an account? Register

                • Login or register to search.
                • First post
                  Last post
                0
                • Recent
                • Tags
                • Popular
                • Users
                • Search