Board Thread:Support Requests - Getting Technical/@comment-24142930-20171230130225

Hello!

I have a CSS class that can change an image on mouseover: .face { background: url('https://vignette.wikia.nocookie.net/street-fighter-sprites/images/8/84/Adon-SFA2-Heavy-Punch.gif/revision/latest?cb=20171224003921') no-repeat; width: 132px; height:107px; } .face:hover { background: url('https://vignette.wikia.nocookie.net/street-fighter-sprites/images/a/ab/Adon-SFA2-Heavy-Punch-Hitbox.gif/revision/latest?cb=20171230004239') no-repeat; } It works perfectly, but I would like to do this with a lot of other images, not just these two. Is there a template I can create so I can choose what images can be used and also change the width/height instead of the example above?

I do have another css class that can change image on mouseover that uses a template, but it doesn't work very well, especially when the backgrounds are transparent as parts of the hover image can be seen behind the image on top.

Any help would be great. Thanks.

Edit: Or as an alternative, is it possible to create css mediawiki pages? In case I had to create many of these classes, it would be easier to organize them in different .css pages 