I’m trying to swap a certain Image per Click on a Button. So i gave the Image an ID and since images in hype are div background images i tried the following codelines:
Probably should wait for a pro to answer, but you could easily do this with scenes or different elements that are hidden using timelines. Would be a quick workaround until you find a clean way to do this.
function changeBgImage(hypeDocument, element, event) {
var imageSwap = hypeDocument.getElementById('imageHolder');
imageSwap.style.backgroundImage = "url('${resourcesFolderName}/image_2.jpg')";
//syntax: element.style.backgroundImage = "url('path to image')";
}
Note 1 ${resourcesFolderName} is a substitution variable for the document’s resources folder. Use this to reference documents added via the Resource Library.
Note 2
As Pappa mentioned in the post just above, consider using Timelines for these kinds of operations. Even if it is not the right technique for your current need, experimenting with the Timeline will prove useful in learning about what Hype’s native interface capabilities can do.
I have different images which can be selected und the user generates a certain combination… So doing hundreds of timeline based combinations is really not an good option