Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #1134908

    is it possible to have on a button which is outside the slider to have the same function as f.e. the avia-slideshow-dots avia-slideshow-controls or on Tab Section the av-section-tab-title
    I see the events on those “buttons” – is it possible to give the function to a button which is f.e. in a color-section beneath.


    Hey Guenter,

    Thank you for the update.

    You can hide the default dots or navigation and create another element that will represent those dots. You can then simulate a click event or trigger the default dot when someone clicked on its alias or the custom dot designated to it.


    Or you can adjust the position of the dots with css.

    Best regards,


    thanks – that was the right idea – with trigger click


    Well i did it in a different way now – your second thought i detached these dots and cloned them into the circles



    The avia-cirle-logo applies the “active” class attribute on mouseover. Maybe, you can modify that script so that it applies the class attribute on click.

    The demo looks nice.

    Best regards,


    my aim is if the slideshow is set to play automatic the circles have to have the active state too. Like the dots in the slideshow.
    That is the problem. To change it from hover to click is surely the next step.
    the one with the Kriesi circle is just an example. I’m thinking about using a button row or other elements for this navigation.


    i prepared the slideshow.js for it.
    but if you new an easier way ( more independent from having another edited ALB ) it would be nice

    I still haven’t understood how to transfer a dynamically added class to another element.
    I must read myself probably nevertheless more into the matter of the Script programming.



    If you don’t want to copy the script in the child theme, you can listen for the “avia_slider_navigate_slide”, “avia_slider_first_slide” and the “avia_slider_last_slide” events, then look for the navigation dot (goto-slide) with the “active” class attribute. The event is triggered whenever the _navigate function is executed. You can probably use the href attribute of the active dot to determine the custom dot that is related to it.

    <a class="goto-slide active" href="#1">1</a>

    Something like:

    slider.on('avia_slider_navigate_slide avia_slider_first_slide avia_slider_last_slide', function() {
       var active = $('').attr('href');
       var dot = $('custom-dot-' + active).addClass('active'); // custom-dot-#2, custom-dot-#3
       // do more

    Best regards,


    I’ll test it this way and then let you know. Thanks for the hint.

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

You must be logged in to reply to this topic.