Change = document iD softly by Javascript ... blend or fade in

iframe

(Ralf Kepnik) #1

I would like to blend a “ changer = document.getElementsByClassName ” softly. Best, with variable in seconds. I find nowhere an idea how and where I can embed this in the script. Has someone an idea for me?
Thanks Ralf

var changer = document.getElementsByClassName(‘abc’);

for (var i=0; i<changer.length; i++)

changer[i].innerHTML = "<iframe src = http://nextgreen.design/00/2A/index.html ; style= ‘position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%’ ";

Intro-Fadein.hype.zip (14,9 KB)


(Jonathan Deutsch) #2

Setting inner html always takes immediate effect. You’ll need to at least use two elements and change the opacity between them.

I’d probably instead just use basic Hype animations of changing the opacity of elements each with the iframe (HTML Widget) that you want. This way also has a preloading advantage, as you’ll want the contents to be all/mostly loaded before beginning the transition.


(Ralf Kepnik) #3

Thank you, Jonathan,
There is also a way to solve the fadein and fadeout in java Skript. I already have an approach, but I’m not really good at writing javascript, i have to learn more there. I keep trying again.

Now, I did it exactly as you suggested.

And it works fine. Take a look hear : http://www.nextgreen.design

Thank you Greetings Ralf


(Jonathan Deutsch) #4

Cool, glad you got it working with your own approach.