image zoomer

User 2624719 Photo


Registered User
283 posts

Hi is there a way of making an image zoom up when you hover over say 200% or a way of adding that element as i am new to this i am a bit lost
Regards Adrian
User 2624719 Photo


Registered User
283 posts

So i have been looking around for code and have tried to understand this image zoom problem and it is as clear as mud
however i fount that there is a theme Black Forest and this has a picture gallery and they have a small zoom . anyone know how this was achieved ?

Regards Adrian
User 122279 Photo


Senior Advisor
14,650 posts
Online Now

Look under Effects. You'll see there is a slight increase in the scaling when set to hover.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 566707 Photo


Registered User
81 posts

@ adrian: that is a nice effect isn't it? I had to look closely at first too. Did you notice the three options 'regular' 'active' and 'hoover'? I bet you did not :0 Click on 'hoover' and scrool downwards again to the 'effects' section Inger already mentioned. You can change scaling, rotating etc. I used that on my own website and it is pretty neat.
User 2624719 Photo


Registered User
283 posts

Yes Inger was spot on with the zoom on hover and this will fit the bill far simpler than getting a third party zoomer with all the extra work that involves . The power of this tool is not to be underestimated. RSD and its forum is a gold mind of information . Max have you got a link to your site i would like to look how you used zoom effect ?

Regards Adrian happy bunny:)
User 2393299 Photo


Registered User
62 posts

Is it possible to Hoover picture so when you Hoover over there is different picture?
User 2699991 Photo


Registered User
5,399 posts
Online Now

Cintaku wrote:
Is it possible to Hoover picture so when you Hoover over there is different picture?


Yes possible you need the 2 images (1 for hover & 1 for regular) you place one on top of the other with the one you want to show first on top),,, set the opacity for that image at regular to 1 ,,,,,then set that same image opacity on HOVER to Zero

Set the one you want to show when hovering opacity regular to 1 hover to 1

You can then go to Transitions (for the image in view view when hovering) set a new transition for the "in/out transition) with OPACITY (scroll down the transitions menu) and play around with the timings for DELAY & Duration to get a nice fade in effect rather than the quick jump
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.