Grow your CSS skills. Land your dream job.

How to add a tooltip

  • # March 2, 2013 at 1:14 am

    Hi everybody
    How can I add a tooltip for all images as small thumbnails
    My Site
    All the small images I want to appear in the same text picture Viewer
    I don’t know how it can be done with a plugin or code
    Can someone help me
    Thank you!

    # March 2, 2013 at 3:35 am

    You may want to have a look at http://kushagragour.in/lab/hint/.

    # March 2, 2013 at 6:48 am

    Hi Hugo Giraudel
    Thanks for the site
    How should I do for my site
    How to edit my site
    I want the text to appear in print exactly as in the picture example
    For all small pictures thumbnails
    Thank you!

    # March 2, 2013 at 8:10 am

    @HugoGiraudel Those are nice. Yours? Here is the one I made. http://www.websitecodetutorials.com/code/css/css3-animated-tooltip-cross-browser.php

    # March 2, 2013 at 8:23 am

    No, HintCSS is from [Kushagra Gour](https://twitter.com/chinchang457).

    # March 2, 2013 at 11:10 am

    You can create new element with absolute position, get user mouse coords and attach it to mouse with some margins when your image is hovered.

    # March 2, 2013 at 11:30 am

    Hi everybody
    What code to put in the css style
    How to edit the functions.php
    In functions.php I have following code
    >
    if (!function_exists(‘theme_get_post_thumbnail’)){
    function theme_get_post_thumbnail($args = array()){
    global $post;

    $size = theme_get_array_value($args, ‘size’, array(theme_get_option(‘theme_metadata_thumbnail_width’), theme_get_option(‘theme_metadata_thumbnail_height’)));
    $auto = theme_get_array_value($args, ‘auto’, theme_get_option(‘theme_metadata_thumbnail_auto’));
    $featured = theme_get_array_value($args, ‘featured’, theme_get_option(‘theme_metadata_use_featured_image_as_thumbnail’));
    $title = theme_get_array_value($args, ‘title’, get_the_title());

    $result = ”;

    if ($featured && (function_exists(‘has_post_thumbnail’)) && (has_post_thumbnail())) {
    ob_start();
    the_post_thumbnail($size, array(‘alt’ => ”, ‘title’ => $title));
    $result = ob_get_clean();
    } elseif ($auto) {
    $attachments = get_children(array(‘post_parent’ => $post->ID, ‘post_status’ => ‘inherit’, ‘post_type’ => ‘attachment’, ‘post_mime_type’ => ‘image’, ‘order’ => ‘ASC’, ‘orderby’ => ‘menu_order ID’));
    if($attachments) {
    $attachment = array_shift($attachments);
    $img = wp_get_attachment_image_src($attachment->ID, $size);
    if (isset($img[0])) {
    $result = ‘‘;
    }
    }
    }
    if($result !== ”){
    $result = ‘

    ‘;
    }
    return $result;
    }
    }>
    At each image thumbnail viewer want to defend the text picture
    Thanks to all

    # March 4, 2013 at 12:59 pm

    Does anyone know how to make 3 weeks all I’m looking for
    Thank you!

    # March 10, 2013 at 9:04 am

    Hi everybody
    I created a tooltip for my site
    [Site link](http://www.retete-super.ro/placinta-cu-branza/ “”)
    How to add html code for thumbanil
    Example Code Html
    p a class=”hint–left hint–warning” data-hint=”This is a warning tooltip”>You did something wrong!

    I want to appear text for images thumbnails 150×150 px in home page
    Thank you

    # March 10, 2013 at 9:06 am

    You did something wrong!

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

You must be logged in to reply to this topic.

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