How can I call a thumbnail/featured image to be a background image?

by

I activated the post thumbnail by putting this in the functions.php:

add_theme_support( 'post-thumbnails');

And this in the loop.php:

<?php the_post_thumbnail('full', array ('class' => 'rollover')) ; ?>

And voila, the featured image appears on the main page, hopefully with the class of “rollover.”

But what I want to do is turn this into a sprite. On my static HTML markup I wrote:

a.rollover: {
    display:block;
    width:300px;
    height:200px;
    text-decoration:none;
    background:url(images/oldtable.jpg);
    arollover:hover {background-position:-300px 0;
}

It works, but how do I make this dynamic (is that the word?) What do I substitute for the url so that the background url changes for each thumbnail? I tried this and it didn’t work:

background:url(<?php wp_get_attachment_image_src());

Can someone help? Thanks.

3 Answers
3

This is not a WordPress related, Anyway here is tip –

You can not call a <?php .. ?> function into your style.css file. Instead set the background inline just as shown in this example, and apple styling.

<div style="background: url('<?php wp_get_attachment_image_src(); ?>');">
   // blah blah ...
</div>

Leave a Comment