I also tried this (which is what I want in theory, but failed miserably, most likely because of my syntax):
<a href="<?php the_permalink() ?>" onmouseover="return tooltip(<?php $imgs = get_the_post_thumbnail($post->ID);
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $imgs, $matches);
$img = $matches [1] [0];
echo 'return tooltip(<<img src="' . $img . '" /><);';?>);">
Okay, I’ve worked out a few things…
This is working with adding in a specific image:
<a href="<?php the_permalink() ?>"
<?php
print ("onmouseover=\"return tooltip('<img src="");
print ("http://www.website.com/image.jpg");
print (""/>');\"")
?>
onmouseout="return hideTip();">
Now, I need to replace that image with the thumbnail of a post. I’ve tried the following, but it doesn’t work:
<a href="<?php the_permalink() ?>"
<?php
$thumbnail = wp_get_attachment_image_src ( get_post_thumbnail_id ( $post->ID ), 'full' ) ;
print ("onmouseover=\"return tooltip('<img src="" . $thumbnail . ""/>');\"")
?>
onmouseout="return hideTip();">
Any ideas? (I feel like I”m just talking to myself here…)
Got it working, here is the final code:
1.) Install ‘SkinnyTip Tooltips’ plugin
2.) Make sure thumbnails are in use on the current theme:
add_theme_support( 'post-thumbnails' );
3.) Add the following code inside my Loop:
<a href="<?php the_permalink() ?>"
<?php
$thumbnail = wp_get_attachment_image_src ( get_post_thumbnail_id ( $post->ID ), 'full' ) ;
print ("onmouseover=\"return tooltip('<img src="" . $thumbnail[0] . ""/>');\"")
?>
onmouseout="return hideTip();" onClick="return false;">
Now, when I hover over my link, a tool tip that has the post thumbnail in it follows the mouse on rollover.
I don’t understand you at all…
1. I’ve installed ‘SkinnyTip Tooltips’ plugin.
2. Thumbnails are in use.
3. What is your Loop?.. Do you just mean code box? Or does Loop actually stand for something in particularly significant?
Do you mind elaborating on how to install it properly? I’ve spent hours trying to get images into tooltips and it’s driving me insane.
