0

Add a jQuery fade effect to a component

asked 2012-05-01 09:41:50 +0800

sboscolo gravatar image sboscolo
66 1

Hi, how can I add a JQuery fade in effect to my bandbox or bandpopup component? Thanks!
This is my code:

<zk>
   <window id="viewShiftTableWindow"
           border="normal"
           width="100%"
           height="100%"
    >
       <bandbox id="myBandBox"
                readonly="true"
                mold="rounded"
       >
          <bandpopup  id="myBandPopup" hflex="min">
             <listbox id="myListBox"
                      multiple="true"
                      checkmark="true"
                      rows="0"
                      hflex="min"
             />
          </bandpopup>
       </bandbox>
    </window>
</zk>

delete flag offensive retag edit

7 Replies

Sort by ยป oldest newest

answered 2012-05-03 06:10:30 +0800

sboscolo gravatar image sboscolo
66 1

Can somebody give help please?

link publish delete flag offensive edit

answered 2012-05-07 02:02:54 +0800

iantsai gravatar image iantsai
2755 1

I think this was what you are looking.
ZK Demo - jQuery Effects

link publish delete flag offensive edit

answered 2012-05-08 12:53:20 +0800

sboscolo gravatar image sboscolo
66 1

Yes, I watched at tha page, but, how would you modify my code in order to apply a fadein-fadeout effect?
I tried in many ways but I was not able to wanted effects...

Thanks.

link publish delete flag offensive edit

answered 2012-05-15 01:56:35 +0800

iantsai gravatar image iantsai
2755 1

I think in the jquery_effect_ctrl.zul showed up how to use it right? have you tried it?

link publish delete flag offensive edit

answered 2012-05-15 19:29:54 +0800

sboscolo gravatar image sboscolo
66 1

Hi iantsai,
On the demo you suggested there is a link to a demo test, a sort sandbox where I found something useful, so I wrote this code:

<zk xmlns:w="client">
   <bandbox id="myBandBox"
            readonly="true"
            mold="rounded"
            w:onOpen="jq(this.$f('myBPOP')).hide().fadeIn()"
   >
      <bandpopup  id="myBPOP" hflex="min">
             <listbox multiple="true"
                      checkmark="true"
                      rows="0"
                      hflex="min"
             >
                <listitem><listcell label="Mary" /></listitem>
                <listitem><listcell label="John" /></listitem>
                <listitem><listcell label="Jane" /></listitem>
             </listbox>
       </bandpopup>
    </bandbox>
</zk>


Fade in seems to work, even if I don't know how to apply a fade-out effect...
A roll-down effect is still present since it is native in bandpopup component. I remember I saw something interesting in the forum in order to remove the roll down/up effect. I will try :)
But now the challenge. As you can see, in my code, I use "w:onOpen" action in order to apply the effect.
What if I use in my java code a onOpen$myBPOP function in order to populate the list with dynamic data?
There will be a collision?
I will try :)
Till then, thanks for your help!

link publish delete flag offensive edit

answered 2012-05-17 02:49:40 +0800

iantsai gravatar image iantsai
2755 1

It should be OK, client-side Anime effect won't disturb any server side action.

link publish delete flag offensive edit

answered 2012-05-17 11:44:45 +0800

sboscolo gravatar image sboscolo
66 1

Yes it is, thanks!

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2012-05-01 09:41:50 +0800

Seen: 349 times

Last updated: May 17 '12

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More