It seems IE6 and IE7, but not Firefox 2.
Here's a link to the page:
http://www.studioturn.com/staging/nr/ailment/adult-add-adhd-symptoms-solutions-info.html
The script is on a link in a purple colored box a bit down the page
with the text "The Difference Between ADD and ADHD"
On Jun 3, 7:32 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> Weird. Only in IE7? Can you point us to a page that has the code? It
> might help to see it in action and take a look at the HTML as well.
>
> --Karl
> _________________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> On Jun 3, 2007, at 6:04 PM, [EMAIL PROTECTED] wrote:
>
>
>
> > It seems I spoke too soon. It appears that the very first instance of
> > the .accToggler class does not have its class changed to
> > the .accTogglerClose class when clicked in IE7. The .accContent
> > expands, but the class does not change. My "close" link in the
> > expanded content when clicked sets the class to the .accTogglerClose
> > class and collapses the content. However, the background image of that
> > close is then set to show a "Close" message, when it should show the
> > "Open" message from the .accToggler settings.
>
> > On May 27, 9:16 pm, "[EMAIL PROTECTED]"
> > <[EMAIL PROTECTED]> wrote:
> >> Perfect! Thank you!
>
> >> On May 25, 7:43 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
>
> >>> Hi Jared,
>
> >>> It looks like the problem now might be caused by the .click() on the
> >>> p.close sort of butting into the add/remove class game where
> >>> the .toggle() method was handling it just fine. I'm going to suggest
> >>> losing the .toggle() altogether and swapping the class with your
> >>> initial .click() on the accToggler class. Give this a whirl:
>
> >>> <script type="text/javascript">
> >>> $(function() {
> >>> $('#ailment .accContent').hide().end()
> >>> .find('.accToggler').click(function() {
> >>> this.className = this.className == 'accToggler' ?
> >>> 'accTogglerClose' : 'accToggler';
> >>> $(this).next().slideToggle();
> >>> });
>
> >>> $('#ailment p.close').click(function() {
> >>> $(this).parent().slideUp()
> >>> .prev().removeClass('accTogglerClose').addClass
> >>> ('accToggler');
> >>> });
> >>> });
> >>> </script>
>
> >>> I think that should do it.
>
> >>> --Karl
> >>> _________________
> >>> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> >>> On May 25, 2007, at 2:06 PM, [EMAIL PROTECTED] wrote:
>
> >>>> Karl, that worked perfect. However, when I then click on the
> >>>> toggler
> >>>> that has been changed back, the class on it is not being changed.
> >>>> Here's the complete jQuery stuff, with the section you refined
> >>>> at the
> >>>> bottom:
>
> >>>> <script type="text/javascript">
> >>>> $(function() {
> >>>> $
> >>>> ('#ailment').find('.accContent').hide().end().find
> >>>> ('.accToggler').click(function()
> >>>> {
> >>>> $(this).next().slideToggle();
> >>>> });
> >>>> $(".accToggler").toggle(function() {
> >>>> $(this).removeClass
> >>>> ("accToggler").addClass("accTogglerClose");
> >>>> },function(){
> >>>> $(this).removeClass
> >>>> ("accTogglerClose").addClass("accToggler");
> >>>> });
> >>>> $('#ailment p.close').click(function() {
> >>>> $(this).parent().slideUp()
> >>>> .prev().removeClass
> >>>> ('accTogglerClose').addClass('accToggler');
> >>>> });
> >>>> });
> >>>> </script>
>
> >>>> On May 25, 1:48 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> >>>>> Hi Jared,
>
> >>>>> It looks like there are a few ways you can tighten up your
> >>>>> selectors,
> >>>>> but the part that you're asking about could be changed from
> >>>>> this ...
>
> >>>>>> $('#ailment').find('.close').click(function() {
> >>>>>> $('.accContent').slideUp();
> >>>>>> $(this).prev('.accToggler').removeClass
> >>>>>> ("accTogglerClose").addClass("accToggler");
> >>>>>> });
>
> >>>>> to this ...
>
> >>>>> $('#ailment p.close').click(function() {
> >>>>> $(this).parent().slideUp()
> >>>>> .prev().removeClass('accTogglerClose').addClass('accToggler');
>
> >>>>> });
>
> >>>>> So, you're first traversing from the clicked element to its parent
> >>>>> and sliding it up; then, you're traversing to the previous
> >>>>> element --
> >>>>> in relation to the parent -- and swapping the classes on it.
>
> >>>>> Hope that helps.
>
> >>>>> --Karl
> >>>>> _________________
> >>>>> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> >>>>> On May 25, 2007, at 11:24 AM, [EMAIL PROTECTED] wrote:
>
> >>>>>> I'm trying to have a "close" link in a div that is expanded by
> >>>>>> click
> >>>>>> on an h3 that is the toggler. The trick is, I need that close
> >>>>>> click to
> >>>>>> then change the class of the h3 that preceeds it, not all h3s
> >>>>>> on the
> >>>>>> page.
>
> >>>>>> <h3 class="accToggler ">Title</h3>
> >>>>>> <div class="accContent">
> >>>>>> <p>Content</p>
> >>>>>> <p class="close">Close</p>
> >>>>>> </div>
>
> >>>>>> So far my script looks like this:
>
> >>>>>> <script type="text/javascript">
> >>>>>> $(function() {
> >>>>>> $
> >>>>>> ('#ailment').find('.accContent').hide().end().find
> >>>>>> ('.accToggler').click(function()
> >>>>>> {
> >>>>>> $(this).next().slideToggle();
> >>>>>> });
> >>>>>> $(".accToggler").toggle(function() {
> >>>>>> $(this).removeClass
> >>>>>> ("accToggler").addClass("accTogglerClose");
> >>>>>> },function(){
> >>>>>> $(this).removeClass
> >>>>>> ("accTogglerClose").addClass("accToggler");
> >>>>>> });
> >>>>>> $('#ailment').find('.close').click(function() {
> >>>>>> $('.accContent').slideUp();
> >>>>>> $
> >>>>>> (this).prev('.accToggler').removeClass
> >>>>>> ("accTogglerClose").addClass
> >>>>>> ("accToggler");
> >>>>>> });
> >>>>>> });
> >>>>>> </script>
>
> >>>>>> Thanks in advance.
