Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Custom Scrollbar Jquery

    General Discussion
    2
    12
    904
    Loading More Posts
    • 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.
    • D
      danielfvmartins last edited by

      Hey @arminunruh!

      I'm trying to customize my scrollbar with jquery, but with no results :/
      Could you help me pleeeease?

      1 Reply Last reply Reply Quote 0
      • D
        danielfvmartins last edited by

        or...can you help me @mariusjopen? I'd really appreciate it!

        1 Reply Last reply Reply Quote 0
        • mariusjopen
          mariusjopen Global Moderator last edited by

          Hi @danielfvmartins

          it is a bit difficult to help if we don't see your website.

          What exactly is the problem?

          Do you have the code ready and you cannot implement it?

          Have a look here:
          http://laytheme.com/documentation.html#custom-javascript

          Let me know how I can help!

          Best!

          Marius

          www.mariusjopen.world

          1 Reply Last reply Reply Quote 0
          • D
            danielfvmartins last edited by

            So, basically i did some webkit scrollbar changes to the website but they don't seem to be compatible with Safari and Firefox.

            I'm trying to implement basic Nicescroll jQuery Plugin just to see if everything is working nicely, but when i try to customize colors and stuff it doesn't seem to be working....

            In summary, i just want to replicate the webkit scrollbar changes i've made on the additional CSS but with JS.

            I'm gonna send you the website login info for your chat :)

            1 Reply Last reply Reply Quote 0
            • mariusjopen
              mariusjopen Global Moderator last edited by

              Hi Daniel,

              I got your chat message and had a look into your page.

              Actually you cannot use this:

              
              <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
              <script src="http://www.daniel-martins.com/wp-content/uploads/2017/10/jquery.nicescroll.min_.js"></script>
              
              <script>
                $(document).ready(function() {
              	var nice = $("html").niceScroll();  // The document page (body)
                });
              </script>
              
              1. jQuery is already installed. It will confuse if you have 2 jQuerys active.
              2. You cannot use document ready. Have a look here:
                http://laytheme.com/documentation.html#custom-javascript

              Let me know if you get further or have a specific question. I cannot code the custom scrollbar for you. But I am happy to assist.

              Best!

              Marius

              www.mariusjopen.world

              D 1 Reply Last reply Reply Quote 0
              • D
                danielfvmartins @mariusjopen last edited by

                Thank you @mariusjopen

                I changed the code and it worked!
                But it still has some minor bugs...

                The scrollbar now appears behind the content and, when the cursor is on top of a video it's not possible to scroll the site.

                Can you give some hints on how to solve this please?

                D 1 Reply Last reply Reply Quote 0
                • D
                  danielfvmartins @danielfvmartins last edited by

                  @mariusjopen i managed to change the z-index

                  But i still would appreciate your help with those two bugs!

                  • when the cursor is on top of a video it's not possible to scroll the site
                  • the scroll on the website it's a bit delayed and 'draggy'
                  1 Reply Last reply Reply Quote 0
                  • mariusjopen
                    mariusjopen Global Moderator last edited by

                    Hi @danielfvmartins ,

                    exactly! The z-index is the way to go.

                    To help you now – I really should have a look on the website.

                    Can you upload it?

                    All the best!

                    Marius

                    www.mariusjopen.world

                    1 Reply Last reply Reply Quote 0
                    • D
                      danielfvmartins last edited by

                      Sure @mariusjopen

                      I sent you again all the access info by chat :)

                      Thank you!
                      Best

                      1 Reply Last reply Reply Quote 0
                      • mariusjopen
                        mariusjopen Global Moderator last edited by

                        Hi @danielfvmartins
                        Ok i see the problem.

                        The jQuery is active when you scroll on the BODY of the website.

                        When you embed a video with Vimeo its gets embedded with an iframe.

                        An iframe has its own body and therefore you code does not get activated.

                        Is it an option to embed the video via MP4 and just upload them?

                        Best!

                        Marius

                        www.mariusjopen.world

                        1 Reply Last reply Reply Quote 0
                        • D
                          danielfvmartins last edited by

                          Hey @mariusjopen
                          I thought about that but I don't think it would be an option. Any ideas to work this out?

                          And what about the lag and delay of the scroll, why is this happening? :(

                          Best
                          Daniel

                          1 Reply Last reply Reply Quote 0
                          • mariusjopen
                            mariusjopen Global Moderator last edited by

                            Hi Daniel,

                            this is because it runs all with Javascript and it needs to run a loop the whole time.

                            I personally would not got for the customized scroll bar.

                            Especially since the iframes cause trouble as well.

                            Best!

                            Marius

                            www.mariusjopen.world

                            1 Reply Last reply Reply Quote 0
                            • First post
                              Last post

                            Before you post

                            Use the Search Feature. Maybe there is already a solution to your issue.

                            1. Update Lay Theme and all Lay Theme Addons
                            2. Disable all Plugins
                            3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                            4. Now see if your problem solved itself
                            5. Go here, see if your problem is listed here:
                            Troubleshooting

                            When you post:
                            1. Post a link to where the problem is
                            2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                            Thanks!

                            Online Users

                            Recent Topics

                            • C

                              image carousel bugging out

                            • N

                              help needed with cleaning up and optimising lay theme portfolio website

                            • R

                              Html5 Video Player issue

                            laytheme.com