How to call the event of one element in another element in JQuery

Tags: javascript,jquery,html,css

Problem :

Here I have some CSS buttons over an image. Basically what is happening now is when I click on the image, the image is zooming onto one position. Now I need the same. The CSS buttons are in a different position on the image. Now when I click the buttons over the image, it should zoom onto that portion of the image.

I also want the same to happen onclick on another div.

Here is my code..

            $('#ex4').zoom({ on:'toggle',duration: 500 });
                    $('#f1').zoom({ on:'toggle',duration: 500 });

In the above code, I have a element that has id="ex4" and an image. When I click on the ex4 element the image zooms up. Similarly, when I click the #f1, the image in ex4 should zoom up. How can I do this?

Solution :

You need to Use trigger():


    CSS Howto..

    How to automatically compile LESS into CSS on the server?

    How do I make cards of different heights fill gap in css? [duplicate]

    How to make two separate, independent columns (using html and css)

    CSS - How to use “vertical-align : middle” with a table near an image?

    How to make layout like notes in Google Keep using CSS?

    How can I apply a custom material design theme to a Bootstrap component

    How to make html lists horizontal in css?

    How to create sub-labels for input elements using HTML

    CSS: How does setting a right margin cause the element's parent to become visible in this example?

    how can i trigger multiple hover actions/events?

    How to make an item to appear for a short time (Either Javascript or CSS) [closed]

    How to match an index of a CSS class with JavaScript?

    How to get CSS pseudo-elements to look the same cross browser?

    How to get css and django working on live server

    How to scale an entire webpage down to ipad or phone size

    How do I add a css class to an Div element in JQuery?

    How to make CSS Animation reverse on hover-out?

    How to reduce the length of the paragraph by dots(…)?

    How to addClass in jQuery to all panels

    how to make menu on mouse hover in CSS

    Foundation CSS Framework, how to change triangle on accodion

    How do you add multile vendor prefixes to one css property?

    How to hide a div off the viewport responsively, and always showing the bottom 50px?

    How to get a frame off animated png using CSS?

    HTML - How do css/javascript files get loaded?

    Bootstrap with Picture Slideshow

    how to edit a css selector in order to shorten the amount of characters used in file

    How to grow the width of a div as the width screen decreases using Css?

    How to assign custom CSS class to arbitrary arbitrary rows of h:dataTable?

    Show / Hide HTML using swatch / HTML 5 - dynamic HTML