Please tell me how to display a pop-up window with a preview inside the article when hovering over a link. I think this is a very usability thing and many will be interested in its implementation. Found this code (illegal), how to make it work? .single.content - I guess the text wrapper and the script looks for a link in it and loads the article preview (hrefcontent) on hover.
Guys, please tell me how to attach a callback to this script and make the pop-up work? Block pops up empty yet (link)
all I could do was display the script and display a popup on hover, I can’t fill the popup with data from the article via the link
/* hovering over links in an article */
$('.entry-content .cherry-block p a').hover(
function(){
if ($(this).attr('href') && !$(this).hasClass('load')&& !$(this).hasClass('loaded')){
$(this).addClass('load');
$(this).html($(this).html()+'<div class="hrefcontent"><div><img src=""></div><h4></h4>'+'<p>Здесь будет превью</p></div>');
var data = {action: 'post_href',href: $(this).attr('href')};
$.post("<?php echo admin_url( 'admin-ajax.php'); ?>", data, function(response) {
if(response.title!=''){
$('.entry-content .cherry-block p a.load').find('h4').html(response.title);
$('.entry-content .cherry-block p a.load').find('p').html(response.description);
$('.entry-content .cherry-block p a.load').find('img').attr('src',response.img);
$('.entry-content .cherry-block p a.load').addClass('loaded').removeClass('load');
} else
$('.entry-content .cherry-block p a.load').find('.hrefcontent').remove();
}, 'json');
}
if($(this).hasClass('loaded') && $(this).find('.hrefcontent') ) {
$(this).find('.hrefcontent').show();
}
},
function(){
$(this).find('.hrefcontent').hide();
});
}); // jQuery End
</script>
<?php
}
add_action('wp_footer', 'my_custom_ajax');
/////////////////////////////////////////////////////////////////////