jQuery Conflict – Carousel Hide/Show Div – minimalist design
-
Greetings,
First my (limited) experience – I’ll understand HTML, CSS and even PHP. jQueries look like Chinese to me (just cut & paste, I tweak only after seeing the effects). And well, I’m learning how WordPress works as I go. I _suspect_ this is a jQuery problem, possibly it loading twice.
I’m modifying a theme – F8-Lite – its minimalist, clean and image heavy. I particularly enjoy how the images automatically change for the feature.
However, I’m trying to insert code from an old design I did – specifically a navigation DIV. NOT a text-based drop-down menu (which I find plenty of information for). It’s a DIV that starts hidden but which is displayed once activated. To function, I insert this into the head:
<script type="text/javascript" src="http://topicjumble.com/wp-content/uploads/2011/02/jquery.js"></script> <!-- --> <script type="text/javascript"> $(function() { $("#jslink").click(function(event) { event.preventDefault(); $("#jsmenu").slideToggle(); }); $("#jsmenu p").click(function(event) { event.preventDefault(); $("#jsmenu").slideUp(); }); }); </script>
In which jslink is a piece of text – “Expand Your Options” – and jsmenu the div full of all the good stuff. Click the words and the new div drops down with images, links, etc.
Doing so, however, invariable breaks the carousel (and not just f8-lite but any other ones I find). I can get one to work – or the other – but not both. I’m not sure how to dissect – and then merge – both sets of code (not even sure where to properly start).
I saw a similar combination at this site. If you click on the bubbles under the image, a new div is shown. If you click on the Scuba Diver image at top, down comes a nice DIV full of useful contact info.
So…. any advice?
- Is there a plug-in that automatically offers such a drop-down?
- Do I need to insert this script somewhere else?
- Is there already a child-theme that maybe adds this in?
- Is there an alternative way to implement an expanding div?
Sincerest thanks in advance,
AJM
- The topic ‘jQuery Conflict – Carousel Hide/Show Div – minimalist design’ is closed to new replies.