Overlay image in a cell

classic12

Hi Guys,
I am pulling an Image for the first cell and some text for the second cell from a database.
I have a responsive layout using the following:

'''
columns: [

        { data: "blogTitle" , title : "Title" , width : '20%',
        render : function ( data, type, row) {
        return '<img style="vertical-align:middle horizontal-align:middle" width="100%"  src="'+data+'"/>';

        }
        },
        {data: "notes", 
        title : "Details",
        width : '80%',
        render: function ( data, type, row ) {
        return  "<div class='setRowHeight' "  + data + " </div>";
        }
        },


                  ]

'''

This all works fine.
I now need to overlay a 'play' button over the image that will scale with the image.

Cheers

Steve Warby

allan

I'm afraid that's really beyond the scope of the support that I can offer for DataTables. However, I would suggest putting the image in a position:relative div and then having the play icon as position:absolute.

Allan

classic12

Thanks Allan. I thought maybe another user had created this magic .....