-1

I am trying to get some accordian drop downs working on this page: https://www.permaculture.org.uk/education/organising-courses

I have basically copied W3schools CSS and JS and pasted them in to CSS injector and JS injector respectively. From here: https://www.w3schools.com/w3css/w3css_accordions.asp

But the drop down accordian function does not seem to work - how can I tell if it's even being applied?

Thanks!

0

But the drop down accordian function does not seem to work

You can put an alert('it works!'); to make sure the jQuery code is indeed running.

Probably it's because you're not wrapping the code in Drupal jQuery syntax.

Assuming Drupal 7.

(function($) {
Drupal.behaviors.myBehavior = {
  attach: function (context, settings) {

    // w3schools code goes here

  }
};
})(jQuery);

For more info, see Working with JavaScript and jQuery

0

You can tell if JS is working by viewing the element in Inspector...

In the below screenshot, yours shows no JS, but on the right which is from my site, you can see an icon that shows that element has some JS attached to it.

enter image description here

Also, from Debugger, I can see your CSS is added but not the JS. As far as I remember, JS Injector's folder is in /files.

enter image description here

Even if you get JS Inspector working, you need to add this to the top and the bottom.

jQuery(document).ready(function($){

// code

});

And to test in your browser, you should know that typing jQuery is the same as $. So for testing, you can use jQuery all the time, or start with $ = jQuery; .

Anyways, here's some basic jQuery that will work for your site. (But you need to make it more accurate.. Your p should have a class, or the parent structure should have a class so you can narrow it down.

$('p').click( function() {
  $(this).next('.panel').toggle();
});

To get it to work in browser Inspector, first type $ = jQuery;, then copy the above code.

enter image description here

  • That's amazing! It;s fixed horray! Thank you so much!!! – Nicola Nov 13 '17 at 10:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.