Grow your CSS skills. Land your dream job.

Make Image Source the Background of an Element

  • # May 22, 2012 at 5:09 pm

    I’m attempting to figure out a JavaScript/jQuery solution that gets the source of image elements and replaces the images with an element that has its background set to the source of said image.

    I’ve written out the following in an attempt to get it working, but it only works on a single image instead of all in the list.

    var slideImgSrc = jQuery('ul.portfolio-slider li.panel img.alignnone').attr('src');
    jQuery('ul.portfolio-slider li.panel img.alignnone').replaceWith('');

    What do I need to do to get it working in the entire list instead of just the first?

    Here’s a jsFiddle:
    http://jsfiddle.net/mrdw2/

    Thank you guys. I’m still not comfortable with JavaScript but I’m getting there.

    # May 22, 2012 at 5:21 pm

    Here ya go!
    http://jsfiddle.net/mrdw2/1/

    $(document).ready(function() {
    $('img').each(function() {
    var imageURL = $(this).attr('src');
    $(this).replaceWith('');
    }):
    });
    # May 22, 2012 at 5:30 pm

    Sweet, thanks Doc!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".