Discussion on Mate Hover | jQuery Plugin

Discussion on Mate Hover | jQuery Plugin

3.25 (12 ratings) 3.25 stars
Cart 103 sales

Zalki-Lab supports this item


19 comments found.

V nice -Wordpress please! Good luck

Thanks :) Will be but later

Looks nice…


Thank you :)

Looks great. Question: Can the hover effect occur on divs, or is this only for image hover? thanks!

Hello.Yes it can. But you must switch autosize option is off, and set the width and height for this div.
Default html structure:
main div
your img
pop-up element (link or div or span)

main div
pop-up element (link or div or span)
pop-up element 2(link or div or span)

main div
height: 200px; // or percent
width: 300px; // or percent

Looks great, really clean :) !

Btw, I saw a bug on it. When you hover on the form, you click on a field (login for example), you hover on other element (“snow” for example), if you type on the keyboard, the form will appear in a buggy style.. Think you should unfocus when hovering out an element :)

Thank you!

Fixed. Thanks :)

No problem :) !

Hi, does this script require Jquery 1.9? I haven’t tested to see if it will work with 1.8.3.

Hi. Yes it will work with jQuery 1.8.3

Can there be several ‘hotspots’ on an image that will show different overlays?

You can use one or two pop-up elements on an image and different overlay

Is the layout adjustable on this – say 4 or 5 smaller images in a row?

Hello. I’m sorry but I do not understand what you mean

Hi, great plugin and I’ve enjoyed implementing it. One thing…. I have set up the metro style to work on isotope using Bootstrap, all’s ok on desktop but when viewing on my ipad I am getting a small gap in between the two panels that slide up and down to meet each other. i.e they don’t quite meet when hovered. Do you know why please?

Hello. Can you show me example?

Ok, i’ll contact you through your profile page with a link.


I have installed on a website and it’s working fine on Chrome, Firefox and Opera, but on Safari 6.0.5 – latest version, it’s not working well, the overlay it’s on halfway, and when I refresh the page, the overlay background only goes half way.

Could you have a look please

Oh yes I saw. But my preview in safari is work fine. Maybe this error is another script?First try to fix the error in the console
Uncaught SyntaxError: Unexpected token < mediaelement-and-player.min.js:1 Uncaught SyntaxError: Unexpected token < mep-feature-playlist.js:1 Uncaught TypeError: Object [object Object] has no method ‘mediaelementplayer’ artists1.php:421

Hi, I have removed the media element script, have no errors on the console but it still doing the same thing on Safari

I’m sorry but I have not found why this is happening

Thanks for the great plugin. I having a little trouble trying to match the size with image and the overlay. The overlay comes out too big. I would appreciate it if you could help me with an solution. Thanks!

Hello. Where your the purchased badge?

Hi there,

Before I purchase, I need to know: 1- Can the overlay be an image or it is solid color (seen from your demo)? 2- Does it work with JQuery 1.9.1 ? 3- Does it change the

  • style? Thanks
  • Hello.
    1.Yes you can use image in the overlay
    overlayBg: ’#000’, // overlay background color,or img
    2.Yes it is work with jQuery 1.9.1
    3. Yes

    Hello, Is there a way to only overlay a specific part of an image? I would like to overlay one large image with a few smaller once. If the person hovers over the specific part the animation shows an image for that specific location of the large image. Could your plug-in be modified to do this?


    Hello, sorry no

    It’s ok! Thanks for the quick Reply!

    Hi there, Im trying to make the Hover work with PrettyPhoto ...

    For some reason, when I use your supplied ’ jquery-1.9.1.min.js ’ the hover works, when I take this out, & use PrettyPhotos ‘jquery-1.4.4.min.js’ it stops the hover from functioning.

    When I leave in just your ’ jquery-1.9.1.min.js ’ (removing the ‘jquery-1.4.4.min.js’ ) the MateHover works, but, wont action the PrettyPhoto lightbox.

    Perhaps you could let me know how I could work this to use your amazing Hover system , that truggers the PrettyPhoto lightbox

    Hello. it’s happened because 1.4 this is very old version of jquery, you can use the migrate plugin

    whoa! never knew that you could migrate – man, this will resolve so many of the issues with other scripts that I was getting Jquery version issues. Man – you know ur stuff! as always, Im so very grateful for your assistance.

    Hi, nice work just what I was looking. Quick question, can I add the hover to a single line of text for example?

    Hello. No, only on the images

    Simply awesome plugin – I must have it!

    Hi. Cool stuff. Can the overlay effect happen on a click instead of a hover? And if so how easily can it be to changed to the click in the in the HTML/CSS or jQuery.

    I don’t have a purchase badge, but if my problem is solved. TAKE MY MONEY! I’ll buy asap (i just want to be 100% sure before the purchase) Thanks.

    Hello, you cant


    I like this one and want to buy but before buying I just want to make one thing. In examples its shows only 3 pics in one row so can we increase it or its fixed to 3 because in my design its 5 images in one row. Please suggest.

    Hello, if you will make 5 pics in row it will be 5 pics

    Hello, great plugin! And it’s easy to implement.

    I have one question

    1) if you want to use an image overlay (say a photograph) instead of a color for overlayBg, how should you write it so the image will fill out entire div without repeating and the overflow is hidden? Right now, if I replace the overlayBg color with a photograph, it only overlays a portion of the div when its on desktop view, but it will cover an entire div when it’s on mobile view. In other words, can you make that image width 100% so it’s a responsive image for the overlayBg?

    2) instead of two pop-ups icons (like for the vote overlay) – can there be one non-ahref text line centered above a centered ahref icon when the div is hovered on? So, instead of side by side, it can be one item above another item?

    Thank you!

    1) Example your id :
    [data-zlname = test22]

    you should create the css class
    [data-zlname = test22] [data-zl-popup]{
            width: 100%;
            height: 100%;
            padding: 0;
        [data-zlname = test22] [data-zl-overlay]{
            background-position: center center;
            background-size: cover !important;
    2) If I understand you correctly you can’t

    i was looking for a hover popup to display a text box when you hover on a particular word or phrase, i downloaded this and couldn’t figure out how to download it b/c I have a wordpress theme site. do i need to download and use the wordpress version and if so are you able to credit me for this version?? Thanx