1
"<a " . $thumbs . " href=\"" . $url . "\" class=\"download\" rel=\"files/" . $dir . "/" . $file . "\" title=\"" . $alt . "\"   ".$hover." > </a>"

マウスがそのリンクの上に置かれると、関数が呼び出されます。

$hover = " onmouseover=\"showImageThumbnail(this, '".$url_thumb."')\"";

関数自体:

function showImageThumbnail(obj, url){          
    xOffset = 30;
    yOffset = 10;

    $.get(url, function(data) {
        $(obj).hover(function(e){

            $("body").append("<p id='screenshot'><img src='data:image/jpg;base64,"+ data +"' alt='Atsisiųsti' /></p>");                              
            $("#screenshot")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px")
            .fadeIn("fast");                        
        },
        function(){ 
            $("#screenshot").remove();
        }); 
        $(obj).mousemove(function(e){
            $("#screenshot")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px");
        });
    });
}

私の問題は、機能が正しく機能していないことです。機能させるには、2 回ホバーする必要があります。この機能はツールチップのようなもので、画像のサムネイルを表示します。メソッドを削除する必要があると思います.hover.が、その後、機能がまったく、または部分的に機能しません(たとえば、カーソルがリンクを離れてもサムネイルが削除されません)。誰かがその機能を修正するのを手伝ってくれますか?

4

1 に答える 1

0

次の変更を試してください

"<a " . $thumbs . " href=\"" . $url . "\" class=\"download\" rel=\"files/" . $dir . "/" . $file . "\" title=\"" . $alt . "\"   image=\"".$url_thumb."\" > </a>"

$(function() {
    var screenshot = $("<p id='screenshot'><img src='data:image/jpg;base64,"
            + data + "' alt='Atsisiusti' /></p>").hide()
            .appendTo('body');
    var img = $('img', screenshot);

    $('.download[image]').hover(function(e) {
            $.get($(this).attr('image'), function(data) {
                img.attr('src', 'data:image/jpg;base64,'
                                + data);
            });

            img.removeAttr('src');

            screenshot.css({
                'top' : (e.pageY - xOffset) + 'px',
                'left' : (e.pageX + yOffset) + 'px'
            }).fadeIn("fast");
        }, function() {
            screenshot.hide();
    }).mousemove(function(e) {
            screenshot.css({
                'top' : (e.pageY - xOffset) + 'px',
                'left' : (e.pageX + yOffset) + 'px'
            })
    });

})
于 2013-03-22T12:40:36.647 に答える