Attention:

Support Rules and Guidelines
Before you post your support topic, please remember to:
  • Read the support forum rules.
  • Check the wiki and use search to see if your problem can be answered there first.
  • Link your board please, and make sure that the problem on your board is visible to guests or provide a test account.
  • Do not post Board Wrappers and CSS unless requested. With a board link, this is not necessary.
  • Be as descriptive as you can and use as many details as possible when describing your problem.
  • Please briefly mark any links to forums that may not be work-safe.
This will help ensure your support issue will be attended to in a quick and efficient manner.

  ClosedNew TopicNew Poll

 jQuery & mini-profiles [SOLVED]
#
hi hello, I'm having a little teeny tiny issue.

i'm trying to use a click toggle on my miniprofile code, and it works great on JSFiddle. It's beautiful even. see? (that's got all my codes there, with filler info since the jcink fields don't carry over to other sites c; )

what i didn't expect is when i popped it into my site, was for all of the miniprofiles to toggle when i clicked the button.

i moved the jquery around, to the top of the wrappers, to the bottom of the wrappers, and even into the miniprofile HTML template area (where it had some success before eventually telling me 'no')

HERE is my board, and everything should be visible to guests.

is there a work around for this issue, or am i going to have to make it an over-done hover?

thanks!!
xXx noä
PM
#
That makes sense. .noa-over-mp is not a unique class, and there's no specification for which one JS is looking for, so it runs slideToggle on all matching elements. Moving the script around will not have any impact on this.

There are several ways to solve that. Ideally, you would do this effect entirely using markup and CSS (checkboxes and usage of the :checked/:not(:checked) selectors). Alternatively, change your script to this:
CODE
$('.noa-over-mp').hide();
 $('button').click(function () {
    $(this).prev('.noa-mp-1').children('.noa-over-mp').slideToggle(400);
});
PM
#
QUOTE (DustBucket @ Dec 20 2016, 10:18 PM)
That makes sense. .noa-over-mp is not a unique class, and there's no specification for which one JS is looking for, so it runs slideToggle on all matching elements. Moving the script around will not have any impact on this.

There are several ways to solve that. Ideally, you would do this effect entirely using markup and CSS (checkboxes and usage of the :checked/:not(:checked) selectors). Alternatively, change your script to this:
CODE
$('.noa-over-mp').hide();
 $('button').click(function () {
    $(this).prev('.noa-mp-1').children('.noa-over-mp').slideToggle(400);
});


changing the script worked like a charm, thank you!!

i kept confusing myself with that last line when i would change it, and my syntax got all goofed so i just posted up what worked and hoped someone would fix it!! which you did thank you thank you!!
PM
#
This topic has been solved. If you need anymore help please post a new thread. Thanks for choosing Jcink services.

signature
email: admin@jcink.com :: blog: John C.
0 User(s) are reading this topic (0 Guests and 0 Anonymous Users)
0 Members:
Share this topic:
« Next Oldest | General Support | Next Newest »

Options ClosedNew TopicNew Poll