Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 7, 2019 at 11:29 am #1064027
    s4phirs

    I have website for events. I am using masonry gallery where I have link on pictures to 3 diffrent categories: Events, Parties, Advantures. I am adding diffrent events(skiing, drifting..) under events category. It’s possible that on gallery you have multiple images on same place. One image swap with another and there is a link on picture that points to event. I know basic php, javascript, need some help to modify masossnry gallery.

    February 9, 2019 at 9:30 pm #1065001
    Victoria

    Hey s4phirs,

    Here are some threads to consider:
    https://kriesi.at/support/topic/change-image-on-mouseover/

    If you need further assistance please let us know.
    Best regards,
    Victoria

    February 13, 2019 at 9:52 am #1066356
    s4phirs

    I triend this solution. But i need to change style inside div.

    <div class=”av-masonry-image-container” style=”background-image: url(http://al-inevents.si/wp-content/uploads/2018/11/Alin-nurburgring-sep2018-JernejKokol-LQ-colorLOGO-65-705×470.jpg);” title=”Alin-nurburgring-sep2018-JernejKokol-LQ-colorLOGO-65″></div>

    I triend this but wont work.

    function add_custom_image(){
    ?>
    <script>
    $(“#av-masonry-1-item-917”).hover(function() {
    $(.av-masonry-image-container).css(“background-image”,”url(http://al-inevents.si/wp-content/uploads/2018/11/Alin-nurburgring-sep2018-JernejKokol-LQ-colorLOGO-65-705×470.jpg);” title=”Alin-nurburgring-sep2018-JernejKokol-LQ-colorLOGO-64) !Important”)
    });

    </script>

    <?php
    }
    add_action(‘wp_footer’, ‘add_custom_image’);

    February 14, 2019 at 4:27 pm #1067029
    Victoria

    Hi s4phirs,

    Do you mean you want the same image for all masonry items on hover?

    Best regards,
    Victoria

    February 14, 2019 at 5:07 pm #1067054
    s4phirs

    no, only specific one

    February 18, 2019 at 9:52 am #1068222
    Ismael

    Hi,

    You should not include the title attribute in the value of the css function. Perhaps, something like this will work.

    
    $( "#av-masonry-1-item-917" ).on( "mouseover", function() {
        var container = $(this).find( ".av-masonry-image-container" );
        container.css( "background-image", "http://al-inevents.si/wp-content/uploads/2018/11/Alin-nurburgring-sep2018-JernejKokol-LQ-colorLOGO-65-705×470.jpg" );
    } );

    Best regards,
    Ismael

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.