Rails spinoffs - Apr 2007 - Technique to blindUp or blindDown from an already open (and random height) container

Longer title:
Technique to blindUp or blindDown from an already open (and random
height) container to another height (and contents) container of the
same name...

Basically,  I''ve got a few links that when clicked do the following:

1. grab an xml file, parse through it, building an array of products
(thumbnails, links, descriptions)
2. build a table
3. innerHTML a pre-existing div
4. blinddown to reveal the div

If the div is already toggled open and populated with products when
another of the links is clicked, I do the following:

a. delete existing children of the div
b. then do steps 1-3 above, effectively insta-switching one set of
products for another.

What I NEED to do:

Rather than insta-switching the innerHTML of the div, I need to
blindUp or blindDown from the div''s current height to the
div''s new
height, then make the switch.

Make sense?

I''ve already gone about this a couple ways, but my brain is foggy and
I could use an idea or a pointing finger for direction at this
juncture..

Thanks!
indexasp


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

I have a few thoughts for you.

1. BlindUp/BlindDown accept the options scaleFrom and scaleTo, which  
are floats from 0 to 100, representing height as a percentage.  You  
could use that.

2. The trouble is, you won''t know how big your second div is going to  
be until you display it. If you''re going to do that, you may wish to  
consider whether the effect you described is the only acceptable  
solution. It might be easier to BlindDown the first, and BlindUp the  
second, running the effects in parallel. It can be a cool effect. Add  
CSS to make them overlap, and you get a different looking (but also  
neat) effect.  I guess what I''m saying is before you go through any  
extra hassle, make sure you haven''t excluded other ways of getting to  
the same end.
2.a. Perhaps you could make good use of Effect.toggle().

3. If BlindDown/Up doesn''t work quite the way you want, maybe  
Effect.Morph will provide what you need.


TAG

On Apr 25, 2007, at 8:19 PM, indexasp wrote:
>
> Longer title:
> Technique to blindUp or blindDown from an already open (and random
> height) container to another height (and contents) container of the
> same name...
>
> Basically,  I''ve got a few links that when clicked do the
following:
>
> 1. grab an xml file, parse through it, building an array of products
> (thumbnails, links, descriptions)
> 2. build a table
> 3. innerHTML a pre-existing div
> 4. blinddown to reveal the div
>
> If the div is already toggled open and populated with products when
> another of the links is clicked, I do the following:
>
> a. delete existing children of the div
> b. then do steps 1-3 above, effectively insta-switching one set of
> products for another.
>
> What I NEED to do:
>
> Rather than insta-switching the innerHTML of the div, I need to
> blindUp or blindDown from the div''s current height to the
div''s new
> height, then make the switch.
>
> Make sense?
>
> I''ve already gone about this a couple ways, but my brain is foggy
and
> I could use an idea or a pointing finger for direction at this
> juncture..
>
> Thanks!
> indexasp
>
>
> >

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Tom Gregory wrote:
> I have a few thoughts for you.
> 
> 1. BlindUp/BlindDown accept the options scaleFrom and scaleTo, which  
> are floats from 0 to 100, representing height as a percentage.  You  
> could use that.
> 
> 2. The trouble is, you won''t know how big your second div is going
to
> be until you display it. 
I''ve been thinking of this too since it would be a really nice effect
to have. I
haven''t done any work on it, but here''s what I''ve
thought of so far:

The main problem is you don''t know how high the new content is actually
going to
be. So create a div that sits outside of the normal document tree (absolute
positioning) that has visibility set to hidden (not display:none). Request the
new content and put it inside this hidden div. Make sure the hidden div has the
same width as the destination div and then grab the height. This should be the
new height of the destination div.

Now, fix the height of the destination div to be it''s current height
(so it
doesn''t auto-expand when you add the new content). Take the innerHTML
of the
hidden div and assign it to the innerHTML of the destination div. Then use
BlindDown with the scaleFrom option.

Very convoluted, but should be the basics of something that could work. Of
course I haven''t actually tried any of this.

-- 
Michael Peters
Developer
Plus Three, LP


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Michael,

Good thinking!  I tried something similar already, but in a different
fashion.

What I tried is grabbing the height (getAttribute) of the TABLE I had
created by parsing the xml file I had grabbed... but there WAS no
height attribute to grab, at least not one that was literal (ie
height=x).. so this returned nothing.   I ended up using a switch to
manually set a height on the table depending on which link was called,
using my insider knowledge of how tall the table would be (due to
testing and firebug).. but obviously this is a poor, no-scaling
solution so I abandoned that line of investigation.

That said, the hidden div wrapper trick you describe may work, IF the
height attribute is available to grab.  I will try this after lunch
and a haircut... Overclocked brain + badly overdue haircut = poor heat
management for cranial computer.

Thanks again!  I''ll post the results of implementing that idea.


On Apr 26, 11:27 am, Michael Peters
<mpet...-aUYv5hkjw45l57MIdRCFDg@public.gmane.org>
wrote:
> Tom Gregory wrote:
> > I have a few thoughts for you.
>
> > 1. BlindUp/BlindDown accept the options scaleFrom and scaleTo, which
> > are floats from 0 to 100, representing height as a percentage.  You
> > could use that.
>
> > 2. The trouble is, you won''t know how big your second div is
going to
> > be until you display it.
>
> I''ve been thinking of this too since it would be a really nice
effect to have. I
> haven''t done any work on it, but here''s what
I''ve thought of so far:
>
> The main problem is you don''t know how high the new content is
actually going to
> be. So create a div that sits outside of the normal document tree (absolute
> positioning) that has visibility set to hidden (not display:none). Request
the
> new content and put it inside this hidden div. Make sure the hidden div has
the
> same width as the destination div and then grab the height. This should be
the
> new height of the destination div.
>
> Now, fix the height of the destination div to be it''s current
height (so it
> doesn''t auto-expand when you add the new content). Take the
innerHTML of the
> hidden div and assign it to the innerHTML of the destination div. Then use
> BlindDown with the scaleFrom option.
>
> Very convoluted, but should be the basics of something that could work. Of
> course I haven''t actually tried any of this.
>
> --
> Michael Peters
> Developer
> Plus Three, LP

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---