Jplayer placement

Hello,

I am using the Highend theme and WOOcommerce to attempt to create a music store that allows the customer to preview each song/product with “Jplayer” on the main shop page instead of having to open each individual product page to view jplayer.

Woo Commerce provided me with the code below to add to the theme’s functions.php file

add_action( 'woocommerce_after_shop_loop_item_title', 'jplayer_on_archives', 11 );
function jplayer_on_archives() {
    echo do_shortcode( '[woo_jplayer]' );
}

However the jplayer is not placed correctly (the price and like options are covered partially. Also the jplayer is way too wide marginal wise and doesn’t look neat under the product thumbnail) To be honest I would actually prefer to have the jplayer pop up as the mouse hovers over the product in a similar fashion as the “Select options” (via option 1 in the screenshot attached). Option 1 is probably a more suitable request for Woocommerce but I figured it’s no harm in asking. I’m almost positive this a WooCommerce request, with being said than could you please provide the correct code for the jplayer placement in option 2(via snapshot attached). Any assistance would be greatly appreciated.

Thanks,
MJ