Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • 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. Custom Scrollbar Jquery

Custom Scrollbar Jquery

Scheduled Pinned Locked Moved General Discussion
12 Posts 2 Posters 1.2k Views
  • 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.
  • dafvD Offline
    dafvD Offline
    dafv
    wrote on last edited by
    #2

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

    1 Reply Last reply
    0
    • mariusjopenM Offline
      mariusjopenM Offline
      mariusjopen
      Global Moderator
      wrote on last edited by
      #3

      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
      0
      • dafvD Offline
        dafvD Offline
        dafv
        wrote on last edited by
        #4

        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
        0
        • mariusjopenM Offline
          mariusjopenM Offline
          mariusjopen
          Global Moderator
          wrote on last edited by
          #5

          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

          dafvD 1 Reply Last reply
          0
          • mariusjopenM mariusjopen

            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

            dafvD Offline
            dafvD Offline
            dafv
            wrote on last edited by
            #6

            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?

            dafvD 1 Reply Last reply
            0
            • dafvD dafv

              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?

              dafvD Offline
              dafvD Offline
              dafv
              wrote on last edited by
              #7

              @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
              0
              • mariusjopenM Offline
                mariusjopenM Offline
                mariusjopen
                Global Moderator
                wrote on last edited by
                #8

                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
                0
                • dafvD Offline
                  dafvD Offline
                  dafv
                  wrote on last edited by
                  #9

                  Sure @mariusjopen

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

                  Thank you!
                  Best

                  1 Reply Last reply
                  0
                  • mariusjopenM Offline
                    mariusjopenM Offline
                    mariusjopen
                    Global Moderator
                    wrote on last edited by
                    #10

                    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
                    0
                    • dafvD Offline
                      dafvD Offline
                      dafv
                      wrote on last edited by
                      #11

                      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
                      0
                      • mariusjopenM Offline
                        mariusjopenM Offline
                        mariusjopen
                        Global Moderator
                        wrote on last edited by
                        #12

                        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
                        0
                        Reply
                        • Reply as topic
                        Log in to reply
                        • Oldest to Newest
                        • Newest to Oldest
                        • Most Votes


                        I also code custom websites or custom Lay features.
                        šŸ’æ Email me here: šŸ’æ
                        info@laytheme.com

                        Before you post:
                        1. When using a WordPress Cache plugin, disable it or clear your cache.
                        2. Update Lay Theme and all Lay Theme Addons
                        3. Disable all Plugins
                        4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

                        This often solves issues you might run into

                        When you post:
                        1. Post a link to where the problem is
                        2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
                        3. If the problem is difficult to explain, post screenshots / link to a video to explain it
                        Online Users
                        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