Click here to Skip to main content
15,901,871 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Im new to ASP.net i got a requirement where i need to implement Zoom effect on mouse hover in ASP.net. So please help me out to resolve the issue.
Posted

Try this

JavaScript
var images = [];
        $(function () {
            $(document).on("mouseover", ".photos li", function () {
                var _image = $(this).find('img');
                _image.finish();
                images[$(this).index()] = {
                    width: _image.width(),
                    height: _image.height()
                };
                _image.animate({
                    width: '290px',
                    height: '250px',
                    top: 0,
                    left: 0,
                    opacity: 1.0
                });
            }).on("mouseout", ".photos li", function () {
                var _image = $(this).find('img');
                _image.finish();
                _image.animate({
                    width: images[$(this).index()].width + "px",
                    height: images[$(this).index()].height + "px",
                    top: '-50%',
                    left: '-50%',
                    opacity: 0.5
                });
            });
        });


Refer:- zoom effect on mouse hover jquery in asp.net
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900