Whenever I'm talking about Prototype.js, I try to make my 'P'
capitalized. When I'm talking about the .prototype property, I try to
make it extremely clear that I'm talking about the property and not
the library.
The good thing about the toggle() method is that it is going to check
the visibility property of the element on its own. Wrapping a check on
.visible() around the .toggle() is erroneous. Just do this:
$(element).toggle()
That will hide it if it's visible and display it if it's not.
Place that code in an event handler somewhere.
Either inline:
<div onclick="this.toggle();"></div>
or in code:
$(element).observe('click',$(element).toggle);
-E
On 12/29/06, James Song <[EMAIL PROTECTED]> wrote:
Thanks Eric!
To be clear, when you guys talk about Prototype, you are talking
about the "prototype.js" that comes with script.aculo.us? Also, so I
would add this:
> visible: function(element) {
> return $(element).getStyle('display') != 'none';
> }
to the Element.addMethods function in the prototype.js file? How
exactly would I implement this in the html file? As I have it right
now, the container div is hidden in HTML level css, not through a css
class ("style="display: none;""). Where would I put this:
> if ( ! $(element).visible() ) {
> $(element).toggle();
> }
??
Sorry for all the questions, but I'm learning as I go. Thanks!
james
On Dec 28, 2006, at 3:39 AM, Eric Harrison wrote:
>
> You could try this:
>
> code:
>
> if ( ! $(element).visible() ) {
> $(element).toggle();
> }
>
> One thing you might need to consider (in case you're like me and
> you're using classes to set the initial display style attribute) is
> that Prototype's Element.Methods.visible() function manually checks
> the .style.display attribute which isn't set if you're setting the
> initial display attribute in a CSS class.
>
> I had to fork my Prototype code like this:
>
> Element.addMethods({
> visible: function(element) {
> return $(element).getStyle('display') != 'none';
> }
> });
>
> That will check the computedStyle of that element and will work in
> most cases.
>
> Let us know if this helps,
>
> -E
>
> On 12/27/06, James Song <[EMAIL PROTECTED]> wrote:
>>
>> Hi guys,
>> i'm relatively new to ajax, and I've built the following site:
>>
>> http://www.bluntside.com/v.x3/index2.html
>>
>> with the help of xilinus and his prototype carousel script. So right
>> now the way it works is I have 2 carousels with x number of
>> thumbnails in them. Each thumnail is a link to an external content
>> page. Right now I have each thumbnail linking to the Effect.toggle
>> function that toggles a container div under the carousel. The problem
>> is that since it's a toggle, after you've expanded the div with a
>> first click, if you click on another thumbnail it will collapse the
>> div. Can anyone suggest a way to check and see if the container is
>> visible or not and then either load the content into the container or
>> close the container? Any help is appreciated. Thanks
>>
>> james
>>
>> >
>>
>
>
> --
> Eric Ryan Harrison
>
> >
>
--
Eric Ryan Harrison
--~--~---------~--~----~------------~-------~--~----~
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 [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
