WordPress.org

Ready to get started?Download WordPress

Forums

Jquery inside a post (2 posts)

  1. bluedrag
    Member
    Posted 2 years ago #

    Hi all,

    I'm trying to get a simple jquery image swap working in one of my posts. Basically when you click on a different color, the picture is shown in that color. I got the plug in working offline on my desktop, but implementing it into WordPress seems to be breaking it. I've checked if WordPress is detecting the jquery library, and it is. Below is the code inside my post for reference..

    <script type="text/javascipt">
    $(document).ready(function(){
    
     $("a.swap1").click(function(){
       $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601BK.png");
     });
    
     $("a.swap2").click(function(){
       $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601NA.png");
     });
    
     $("a.swap3").click(function(){
       $("img.img-swap").attr("src", "http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601RW.png");
     });
    
    });
    
    </script>
    
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar("bongos") ) : ?>
    <?php endif; ?>
    
    <div class="left">
    
    <h1>C1601</h1>
    
    <p>Double Conga Set 10” & 11” with Stand </p>
    
    <ul>
    <li><strong>Colours:</strong></li>
    <li><a class="swap1" href="#">-BK (Black Wood)</a></li>
    <li><a class="swap2" href="#">-NA (Natural)</a></li>
    <li><a class="swap3" href="#">-RW (Red Wood)</a></li>
    </ul>
    
    </div>
    
    <div class="right">
    <img class="img-swap" src="http://konggraphics.com/mano/wp-content/uploads/2012/01/MP1601BK.png" alt="Mano Conga" />
    
    </div>

    I have the phpexec plug in running, the widgets are working perfectly. It's only the Jquery that doesn't seem to be working.

    Thanks for you help!

  2. dkotter
    Member
    Posted 2 years ago #

    Do you have a link I could check out? My first thought is if you are using the version of jQuery that WordPress loads, I believe it loads it in compatibility mode, which means to reference it you can't use $, you have to use jQuery. So you could try replacing the $ with jQuery and see if that works.

Topic Closed

This topic has been closed to new replies.

About this Topic