Hi folks, I''m putting together a site that will have a shopping cart tab along the top which, when clicked, slides down to reveal the full contents of the cart (covering the page underneath it). When designing it and getting the styling right, I had the page display the cart fully open by default. This worked fine - the cart can close and open any number of times without problem[1]. However, the intention is that the cart is normally closed when the page is loaded. When I made that the default, with display: none; the cart would no longer open. I tried all sorts of things to fix it, or to just see what was going on, but I confess my javascript is weak - it''s why I chose script.aculo.us in the first place :) I''ve simplified the page down to these two examples: http://www.vorivore.com/cart-slide-test-closed.html and http://www.vorivore.com/cart-slide-test-open.html and the css for them is at http://www.vorivore.com/cart-slide-test.css (the full mockup page with cart is at http://www.vorivore.com/vorivore-cart-mock-down.html ) I''d appreciate any advice on how to make this work - I''m a bit past my depth here. [1] Actually, IE fails to animate the close, and both IE and FF has a "flash" or "blip" problem as well, but I''ll settle for having it work before I worry about details like that. -Jim
Hi folks, I''m putting together a site that will have a shopping cart tab along the top which, when clicked, slides down to reveal the full contents of the cart (covering the page underneath it). When designing it and getting the styling right, I had the page display the cart fully open by default. This worked fine - the cart can close and open any number of times without problem[1]. However, the intention is that the cart is normally closed when the page is loaded. When I made that the default, with display: none; the cart would no longer open. I tried all sorts of things to fix it, or to just see what was going on, but I confess my javascript is weak - it''s why I chose script.aculo.us in the first place :) I''ve simplified the page down to these two examples: http://www.vorivore.com/cart-slide-test-closed.html and http://www.vorivore.com/cart-slide-test-open.html and the css for them is at http://www.vorivore.com/cart-slide-test.css (the full mockup page with cart is at http://www.vorivore.com/vorivore-cart-mock-down.html ) I''d appreciate any advice on how to make this work - I''m a bit past my depth here. [1] Actually, IE fails to animate the close, and both IE and FF has a "flash" or "blip" problem as well, but I''ll settle for having it work before I worry about details like that. -Jim
Hey Jim
I think it''s best to programmatically set the hidden attribute on your
cart
:
Element.hide(''cart-expanded'');
See the archived mails for some info that I think is related. It''s to
do
with the difficulties of overriding CSS element declarations that''s
aren''t
set via a style attribute (i.e. proper external CSS).
Sept Archive
<http://wrath.rubyonrails.org/pipermail/rails-spinoffs/2005-September/thread
.html>
Thread subj <Element.show - element.style.display=''''>
HTH
Matt
> -----Original Message-----
> From:
rails-spinoffs-bounces-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org
>
[mailto:rails-spinoffs-bounces-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org]
On
> Behalf Of Jim Meier
> Sent: 25 November 2005 01:28
> To: rails-spinoffs-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org
> Subject: [Rails-spinoffs] BlindDown recommendations?
>
>
> Hi folks,
>
> I''m putting together a site that will have a shopping cart
> tab along the
> top which, when clicked, slides down to reveal the full
> contents of the cart (covering the page underneath it).
>
> When designing it and getting the styling right, I had the
> page display the cart fully open by default. This worked fine
> - the cart can close and open any number of times without problem[1].
>
> However, the intention is that the cart is normally closed
> when the page is loaded. When I made that the default, with
> display: none; the cart would no longer open. I tried all
> sorts of things to fix it, or to just see what was going on,
> but I confess my javascript is weak - it''s why I chose
> script.aculo.us in the first place :)
>
> I''ve simplified the page down to these two examples:
>
> http://www.vorivore.com/cart-slide-test-closed.html
>
> and
>
> http://www.vorivore.com/cart-slide-test-open.html
>
> and the css for them is at
>
> http://www.vorivore.com/cart-slide-test.css
>
> (the full mockup page with cart is at
> http://www.vorivore.com/vorivore-cart-mock-down.html )
>
> I''d appreciate any advice on how to make this work - I''m
a
> bit past my depth here.
>
>
> [1] Actually, IE fails to animate the close, and both IE and
> FF has a "flash" or "blip" problem as well, but
I''ll settle
> for having it work before I worry about details like that.
>
> -Jim
>
>
>
> _______________________________________________
> Rails-spinoffs mailing list
Rails-spinoffs-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org
> http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
>
***********************************************************************************
The Royal Bank of Scotland plc. Registered in Scotland No 90312.
Registered Office: 36 St Andrew Square, Edinburgh EH2 2YB.
Authorised and regulated by the Financial Services Authority
This e-mail message is confidential and for use by the
addressee only. If the message is received by anyone other
than the addressee, please return the message to the sender
by replying to it and then delete the message from your
computer. Internet e-mails are not necessarily secure. The
Royal Bank of Scotland plc does not accept responsibility for
changes made to this message after it was sent.
Whilst all reasonable care has been taken to avoid the
transmission of viruses, it is the responsibility of the recipient to
ensure that the onward transmission, opening or use of this
message and any attachments will not adversely affect its
systems or data. No responsibility is accepted by The Royal
Bank of Scotland plc in this regard and the recipient should carry
out such virus and other checks as it considers appropriate.
Visit our websites at:
http://www.rbs.co.uk/CBFM
http://www.rbsmarkets.com
********************************************************************************
First, sorry to the list for the double posting. I''m a goof. SPENDLOVE, Matt, FM wrote:> I think it''s best to programmatically set the hidden attribute on your cart > Element.hide(''cart-expanded''); > > See the archived mails for some info that I think is related. It''s to do > with the difficulties of overriding CSS element declarations that''s aren''t > set via a style attribute (i.e. proper external CSS).Thanks, Matt! Setting the {display:none} via a style attribute did the trick for my example pages. Very nice! Unfortunately, it doesn''t seem to be working on the cart mockup. The cart itself is a bit complex; would the contents and their styling affect it? The page in question is http://www.vorivore.com/vorivore-cart-down-mock.html and css at http://www.vorivore.com/vorivore.css -Jim
Jim Meier wrote:> Unfortunately, it doesn''t seem to be working on the cart mockup. The > cart itself is a bit complex; would the contents and their styling > affect it?Never mind, I had an old css file laying around causing havoc. Everything works great now, apart from the initial flash of full-sized content. Thanks a lot Matt! happy scripting, -Jim