Hi there!
Can I test if a component has r:effect applied? Or something that could let me toggle r:effect ?
What I'm trying to do:
I have an h:graphicImage component that I want to fade (40%) on onclick event and remove fade on next onclick event. So, first click: fade 40%, second click remove fade, third click fade 40% again, and so on.
My snippet code:
<a4j:outputPanel id="gallery"> <div id="imagesDiv"><h:graphicImage value="/imagens/lock.png" id="lockImage" onclick="showDiv()" /></div> </a4j:outputPanel> <r:effect for="window" event="onload" type="Fade" targetId="imagesDiv" params="duration:0.8,from:1.0,to:0.4" /> <r:effect name="showDiv" type="Appear" targetId="imagesDiv" params="duration:0.8,from:0.4,to:1.0" /> <r:effect name="fadeDiv" type="Fade" targetId="imagesDiv" params="duration:0.8,from:1.0,to:1.0" />
How to make something like this ?
onclick="#{r:findComponent('imagesDiv').isFadeApplied() ? showDiv() : fadeDiv()}"
I can do it using jQuery, but seems not right as I need to set some component's attributes to test.
Another question is: why I can't use r:effect functions names for h:graphicImage Id's directly, only on 'div' elements?
Thank you in advance!