Home Forums Max Are crosslinks working in Tabgroup/Liquid Slider?

This topic contains 5 replies, has 2 voices, and was last updated by  Joshua 2 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #47652

    Lynne
    Participant

    Is it possible to use crosslinks to link from one tab to another in Max?

    I’ve already tried the following code but it is not working:

    <a href="#right" data-liquidslider-ref="liquid-slider-1">Next</a>
    Thanks,
    Lynne

    • This topic was modified 2 weeks, 4 days ago by  Lynne.
    #47657

    Joshua
    Keymaster

    Hi Lynne,

    Sorry, Liquid slider doesn’t support this. There is a fork (modified version) someone made that does this, but you’d have to manually replace the Liquid slider plugin.

    https://coderwall.com/p/mnpjog/liquid-slider-using-your-own-navigation-links

    #47662

    Lynne
    Participant

    At first, I thought that crosslinks weren’t supported, but when I researched the web and got a little more into the script for Liquid Slider by Kevin Batdorf, I noticed a bit about „crossLinks“, so I tried to find out more.

    Here’s a snippet from the code that came with my version of Max:

    /*!
     *  Liquid Slider v2.0.12
     *  http://liquidslider.com
     *  GPL license
     */
    […]
    registerCrossLinks:function(){var f=this;f.crosslinks=d("[data-liquidslider-ref*="+(f.sliderId).split("#")[1]+"]");(f.crosslinks).on("click",function(g){if(f.options.autoSlide===true){f.startAutoSlide(true)}f.setNextPanel(f.getPanelNumber((d(this).attr("href").split("#")[1]),f.options.panelTitleSelector));g.preventDefault()});f.updateClass()},

    (This bit is taken from the jquery.liquid-slider.min.js.)

    Also, on the page you’re refering to the developer himself, Kevin, writes:

    Hey, thanks for using my code! Alternatively, you could have used the following to put navigation anywhere on the page:

    crossLinks:true

    Slide 1
    and you can also use #left or #right too in place of #1.

    However, this method doesn’t seem to work using Liquid Slider in Max. Also, I am not sure how to set crosslinks to true, or if they should be activated by default anyway.

    • This reply was modified 2 weeks, 2 days ago by  Lynne.
    • This reply was modified 2 weeks, 2 days ago by  Lynne.
    • This reply was modified 2 weeks, 2 days ago by  Lynne.
    • This reply was modified 2 weeks, 2 days ago by  Lynne.
    #47667

    Joshua
    Keymaster

    You’d have to change the Max theme’s initialize function (assuming it does work in his version of Liquid Slider).

    In your Max theme’s scripts.js file after line 435, add:

    crossLinks:true,

    And your link would look like this with ‘slider-id’ replaced with the correct ID and ‘#1′ replaced with the slide you’d like to link to:

    <a href="#1" data-liquidslider-ref="slider-id">Slide 1</a>

    I can’t confirm that this works with his version, but if you link back with your site and this added, I’ll take a look for you.

    #47670

    Lynne
    Participant

    I figured it out myself by comparing documentation and file versions in Github. This is the solution.

    Maybe one bit of helpful information: The correct slider id for the Max theme is

    liquid-slider-1
    (It won’t work with other ids.)

    Now it works like a charm! Thanks for looking into this. I hope it will be helpful for other users as well.

    • This reply was modified 2 weeks, 1 day ago by  Lynne.
    • This reply was modified 2 weeks, 1 day ago by  Lynne.
    #47674

    Joshua
    Keymaster

    Thanks for reporting back your solution.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.