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. Addons
  3. SVG mouse cursor for the carousel

SVG mouse cursor for the carousel

Scheduled Pinned Locked Moved Addons
16 Posts 6 Posters 1.6k 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.
  • edgrbnzE Offline
    edgrbnzE Offline
    edgrbnz
    wrote on last edited by edgrbnz
    #4

    🤔I understand…

    The carousel plugin seems to not accept SVGs as images – which looks like a simple issue to me that might be fixable via an update (am I right @mariusjopen, @arminunruh?).

    So long you could also try to overwrite the cursors via custom CSS and embed the SVGs you’d like to use there. Or try to paste the SVG’s path directly into custom CSS.

    It might work with something along these lines:

    /*replace lorem with the paths to your svgs!*/
    
    .lay-carousel.cursor-right {
      cursor: url("lorem") !important; 
      }
    
    .lay-carousel.cursor-left {
      cursor: url("lorem") !important;
      }
    
    

    PS:
    It looks to me you have fixed it by now with a different SVG, right?

    ✦ ✦ ✦

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

      Dear @Marcol
      yes @edgrbnz you are right. It does not support SVG images.

      The best is to have a quick look here:
      https://flickity.metafizzy.co/

      This is the carousel we use.
      You can add a SVG path though.

      I will check with Armin about that.

      Best!

      Marius

      www.mariusjopen.world

      M 1 Reply Last reply
      0
      • M Offline
        M Offline
        Marcol
        wrote on last edited by
        #6

        Yes @edgrbnz, i tried with a simpler arrow cursor. I'll try the custom css you recommended.

        Many thanks

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

          Cool! Hope it will work!

          www.mariusjopen.world

          1 Reply Last reply
          0
          • mariusjopenM mariusjopen

            Dear @Marcol
            yes @edgrbnz you are right. It does not support SVG images.

            The best is to have a quick look here:
            https://flickity.metafizzy.co/

            This is the carousel we use.
            You can add a SVG path though.

            I will check with Armin about that.

            Best!

            Marius

            M Offline
            M Offline
            Marcol
            wrote on last edited by
            #8

            @mariusjopen Many thanks :)

            1 Reply Last reply
            0
            • edgrbnzE edgrbnz

              🤔I understand…

              The carousel plugin seems to not accept SVGs as images – which looks like a simple issue to me that might be fixable via an update (am I right @mariusjopen, @arminunruh?).

              So long you could also try to overwrite the cursors via custom CSS and embed the SVGs you’d like to use there. Or try to paste the SVG’s path directly into custom CSS.

              It might work with something along these lines:

              /*replace lorem with the paths to your svgs!*/
              
              .lay-carousel.cursor-right {
                cursor: url("lorem") !important; 
                }
              
              .lay-carousel.cursor-left {
                cursor: url("lorem") !important;
                }
              
              

              PS:
              It looks to me you have fixed it by now with a different SVG, right?

              M Offline
              M Offline
              Marcol
              wrote on last edited by
              #9

              @edgrbnz Your code works fine on chrome! Thank you so much again!

              1 Reply Last reply
              1
              • edgrbnzE Offline
                edgrbnzE Offline
                edgrbnz
                wrote on last edited by edgrbnz
                #10

                You’re more than welcome!
                Glad it works.
                Let’s mark this solved.

                ✦ ✦ ✦

                1 Reply Last reply
                0
                • 12b1 Offline
                  12b1 Offline
                  12b
                  wrote on last edited by
                  #11

                  Is it possible to use an svg path simply through the CSS or will the SVG still need to be uploaded as an image?

                  1 Reply Last reply
                  0
                  • edgrbnzE Offline
                    edgrbnzE Offline
                    edgrbnz
                    wrote on last edited by
                    #12

                    Good question!

                    Did you try the code above 👆with something along the lines of this. Although I don’t think you need the cached feature for this it’s worth a try to find out if inline SVGs work.

                    Let us know if it works.

                    Cheers!

                    ✦ ✦ ✦

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

                      Dear @12b
                      I think in laytheme it needs to exist as image otherwise you cannot treat it like an image.

                      But as CUSTOM HTML element you can sue SCH Code as well.

                      Best!

                      Marius

                      www.mariusjopen.world

                      1 Reply Last reply
                      0
                      • S Offline
                        S Offline
                        Sojoer
                        wrote on last edited by
                        #14

                        @mariusjopen It's been a while – but I wonder if it's possible now to use SVGs as Mouse Coursers for the carousel. I cannot code myself, so I wonder if it's a feature now?

                        1 Reply Last reply
                        0
                        • arminunruhA Offline
                          arminunruhA Offline
                          arminunruh
                          Global Moderator
                          wrote on last edited by
                          #15

                          yes its possible

                          http://laythemeforum.com:4567/topic/5190/svg-cursors-fix/17

                          u can just set a .svg image for any cursors for the addons

                          1 Reply Last reply
                          0
                          • S Offline
                            S Offline
                            Sojoer
                            wrote on last edited by
                            #16

                            thank you :) it worked

                            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
                            dafvD
                            dafv
                            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