Inserting PHP into jQuery css()

4 Views

I’m working on a WordPress theme and I have come across a little block. I have a small app within the theme that highlights a person’s name when you click on it:

jQuery

Read More
    <script type="text/javascript">
        $(".testimonial-person").click(function() {
            $(".testimonial-person").css( "background", "none");
            var tID = this.id;
            $("#" + tID).css( "background", "url('images/halftone.png') #DDD");
            $(".testimonial-text").fadeOut(100);
            $("#box-" + tID).delay(102).fadeIn(100);
        });
    </script>

The issue is that the css() line that shows a background image, that background image is actually a dynamic value – something that would look like this: 

$("#" + tID).css( "background", "url('<?php bloginfo('stylesheet_url'); ?>/images/halftone.png' #DDD");

See how the quote marks contradict each other? Does anyone know a way around this, OR a better way to call the image in WordPress?

Post Views: 4

Related posts

Leave a Reply

1 comment

  1. The quotes don’t matter at all in this particular case, as the quotes you use between <?php and ?> are interpreted by php and as such never reach the browser, where the javascript will be interpreted. Actually, the problem is that you forgot a closing ). Your ouput will now be:

    $("#" + tID).css( "background", "url('http://url.com/images/halftone.png' #DDD");

    And correct would be:

    $("#" + tID).css( "background", "url('http://url.com/images/halftone.png') #DDD");

    Take attention to the second closing parenthesis after the ...halftone.png'

    So your php code would look like this:

    $("#" + tID).css( "background", "url('<?php bloginfo('stylesheet_url'); ?>/images/halftone.png') #DDD");