Log in

View Full Version : CSS image replacement code



weblost
01-18-2019, 08:31 PM
Hello,

I installed Dynamic Drive's CSS based image replacement code.

It functions - but -

I am having trouble figuring out which CSS instruction set controls the "thumb" image, which on this particular page is about 200px X 300px. The default image is very small as presented by the code.is very small.

The expanded image loads properly - but I have been trying to raise it higher on the page. My old javascript had two parameters - one for horizontal and one for vertical positioning

As I change one parameter it appears to either not do what I'd like it to do, or it affects the other image.

1 - how to size the thumb?

2 - how to size the expanded image?

(Which CSS parameters do I use for each?)

Thanks,

Weblost

davidlee21
01-28-2019, 10:01 AM
Try using this code to size the expanded image

{
background: url(mountain.jpg);
background-repeat: no-repeat;
background-size: 300px 100px;
}

weblost
02-03-2019, 01:17 PM
David ,

Thank you,

I will try it and see if I can get it to work.

(Excuse the delay - I write and am on a "deadline" for a project.)






Try using this code to size the expanded image

{
background: url(mountain.jpg);
background-repeat: no-repeat;
background-size: 300px 100px;
}

Pajak
04-12-2019, 10:57 AM
Do the images display correctly on mobile too with this resize code?

Afflospark
04-22-2019, 03:09 PM
Hello,
As I read you want to know how you expand the image size.
you have to try code to expand your image like
Code:

{
background: url(Your image name);
background-repeat: no-repeat;
background-size: 300px 100px;
}
Hope this will help you.
Thanks