CODEWITHSUNDEEP
jquery
Staffan Estberg
Staffan Estberg

Reputation: 7035

jQuery Cloud Zoom: activate script via click instead of hover

As the title suggests I'm looking for a way to initiate the jQuery Cloud Zoom script so that it runs when the user clicks an element on the page and not when hovering an image. I've tried the official forum for the plugin but with no luck, perhaps someone here has created a similar solution before.

Upvotes: 2

Views: 5044

Answers (4)

Pankaj Sharma
Pankaj Sharma

Reputation: 1

You need to change directly in cloudjs file mousemove............replace mousemove to click event

Upvotes: 0

Felix Geenen
Felix Geenen

Reputation: 2707

since version V3.0 rev 1302271415 you can achieve this behavior by setting the cloudzoom option "mouseTriggerEvent".

Example:

html:

<a href="/link/to/big/img.jpg" class="zoom">
    <img src="/link/to/small/img.jpg" width="50" height="50" alt="" />
</a>

js:

jQuery('a.zoom img').CloudZoom({mouseTriggerEvent: 'click'});

See all available options Cloud Zoom Quickstart Guide

Upvotes: 0

Akshay Jindal
Akshay Jindal

Reputation: 385

use this code 

 $(document).ready(function(){
        $('.cloud-zoom-gallery').CloudZoom(); 
        $('#cloudZoom').click(function(){
            $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom();      
            return false;
        })

    });

Upvotes: 2

JP Hellemons
JP Hellemons

Reputation: 6057

Have you tried this:

$(document).ready(function () {
    $('#itemToZoom').Click(new function(){
        $(this).CloudZoom();
    });
});

Upvotes: 2

Related Questions