Skip to main content
Participant
July 2, 2018
Answered

mm_swapimage doesn't work

  • July 2, 2018
  • 6 replies
  • 1036 views

I have created an HTML page using Dreamweaver. In this page, there is a thumbnail, and I would like a larger image to appear when the mouse hovers over the thumbnail. No hover image appears. This does not work in MS Edge and in Google Chrome. None of the other posts to this forum appear to have answered this question.

The URL of the page is Friends of Calligraphy Alphabet Back Issues - Carl Rohrs, Editor

Thank you

This topic has been closed for replies.
Correct answer Nancy OShea

This site looks like it was built quite a while ago with old HTML and table-based layouts.  Just so you know,  having a mobile friendly web site is not just practical, it's essential because there are more mobile device users now than ever before.

https://search.google.com/test/mobile-friendly

6 replies

pziecina
Legend
July 2, 2018

Instead of using outdated Dw javascript behaviours you could use -

#imageincrease {

    -webkit-transition: all 3s ease-in-out;

    -webkit-transform-origin: -2em -2em;

    -moz-transition: all 3s ease-in-out;

    -moz-transform-origin: -0.3em -0.2em;

    -ms-transition: all 3s ease-in-out;

    -ms-transform-origin: -0.3em -0.2em;

    transition: all 3s ease-in-out;

    transform-origin: -0.3em -0.2em;

}

#imageincrease:hover {

    -webkit-transform: scale(2.0, 2.0);

    -moz-transform: scale(2.0, 2.0);

    -ms-transform: scale(2.0, 2.0);

    transform:: scale(2.0, 2.0);

}

Give the image an id of imageincrease, and copy the css to your css file. The image will double in size on hover over a 3 second time period.

pziecina
Legend
July 2, 2018

first - I am very surprised Dw still has such behaviours. They got rid of the Spry framework because it was outdated, yet kept these!!

On a touch screen all the user has to do to enlarge an image is double tap or pinch to zoom, so for touch screen users the only fallback is a message saying 'pinch to zoom'.

Nancy OShea
Community Expert
Community Expert
July 2, 2018

pziecina  wrote

On a touch screen all the user has to do to enlarge an image is double tap or pinch to zoom, so for touch screen users the only fallback is a message saying 'pinch to zoom'.

The trouble is a  low res thumbnail image won't look good when zoomed.

Nancy O'Shea— Product User & Community Expert
pziecina
Legend
July 2, 2018

https://forums.adobe.com/people/Nancy+OShea  wrote

The trouble is a  low res thumbnail image won't look good when zoomed.

Depends on how the image was optimised for web, and the zoom factor applied.

One could always use the browsers built in css image optimization routines, which are probably being applied by most mobile browsers anyway, if only 1x or 2x images are being used.

Nancy OShea
Community Expert
Nancy OSheaCommunity ExpertCorrect answer
Community Expert
July 2, 2018

This site looks like it was built quite a while ago with old HTML and table-based layouts.  Just so you know,  having a mobile friendly web site is not just practical, it's essential because there are more mobile device users now than ever before.

https://search.google.com/test/mobile-friendly

Nancy O'Shea— Product User & Community Expert
Nancy OShea
Community Expert
Community Expert
July 2, 2018

I see the large image on CLICK in Firefox, MS Edge & Chrome.

Mouseover behaviors don't do anything on touch screen devices because there is no mouse.

Nancy O'Shea— Product User & Community Expert
Legend
July 2, 2018

I agree with Wolf.

At the moment you CAN click on the images and they enlarge in their own external window. A Modal window, one which opens up within the parent browser window would be better, but an extrenal window is better than nothing.

I would just add a little magnifying glass icon as part of the image or over the image, near  the image so users know to click on them if they require to view a larger version.

WolfShade
Legend
July 2, 2018

osgood_  wrote

A Modal window, one which opens up within the parent browser window would be better, but an extrenal window is better than nothing.

Agreed, but an external window (aka popup) will be defeated if anyone is using a browsers popup blocker.

V/r,

^ _ ^

Nancy OShea
Community Expert
Community Expert
July 2, 2018

WolfShade  wrote

osgood_   wrote

A Modal window, one which opens up within the parent browser window would be better, but an extrenal window is better than nothing.

Agreed, but an external window (aka popup) will be defeated if anyone is using a browsers popup blocker.

V/r,

^ _ ^

I have pop-up blockers enabled.  The onlckick event is not blocked if user initiates it.   But yes,  I think a Modal window would look nicer. 

Nancy O'Shea— Product User & Community Expert
WolfShade
Legend
July 2, 2018

Personally, I detest "hover" actions that make something magnified, or appear with other options.  Best left to a click event as opposed to hover.  Honestly.

As far as the MM swap image function, if you can write your own you'd be better off.  The mm_swapimage function is out of date for modern browsers.  OR, you could bring it into the 21st century and go with a CSS solution, no javascript.  That'd be the better way to go, IMHO.

HTH,

^ _ ^

PS:  "hover" doesn't exist in the mobile/tablet world, anyway.