Question

是否有一种方法可以将工具提示添加到缩略图中，以便在鼠标悬停在其上时显示完整标题？还有一种方法可以删除“点击这里”按钮并显示缩略图等？可以找到工作代码here

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("body").append("<div id = 'data'><ul>.</ul></div>");
        var dataContainer = $("#data ul");
        $.ajax({
            url:'http://gdata.youtube.com/feeds/api/users/googledevelopers/uploads?max-results=50&alt=jsonc&v=2&callback=?',
            dataType: "jsonp",
            timeout: 5000,
            success: function(data){

                     $.each(data.data.items, 
                               function(i, val) {

                                 if (typeof(val.player) !== 'undefined' && typeof(val.title) !== 'undefined') {

                                    dataContainer.append('<div class="d e"><a href='+val.player["default"]+' target="_blank">'+val.title+'</a><br /><img src="'+val.thumbnail.sqDefault+'" width="120" height="90" alt="'+val.title+'"/><br />Views '+val.viewCount+'</div>');
                                 }
                         });
                    }
                });
            });
});
</script>





<body>
<h2>Youtube Most Viewed</h2>
<p>most viewed today</p>
<p><button>Click Here</button></p>

<p><script language="JavaScript">
<!--
date=Date()
document.write(date)
//-->
</script></p>

</body></html>

Answer 1

您想要更改的内容似乎非常简单 - 无需点击此处的加载即可自动加载，请删除此行：

$("button").click(function(){

关闭行的

和一个：

});

当然你也想要删除：

<p><button>Click Here</button></p>

至于标题，请尝试更改此行：

dataContainer.append('<div class="d e"><a href='+val.player["default"]+' target="_blank">'+val.title+'</a><br /><img src="'+val.thumbnail.sqDefault+'" width="120" height="90" alt="'+val.title+'"/><br />Views '+val.viewCount+'</div>');

到这个新行：

dataContainer.append('<div class="d e"><a href='+val.player["default"]+' target="_blank" title="'+val.title+'">'+val.title+'</a><br /><img src="'+val.thumbnail.sqDefault+'" width="120" height="90" alt="'+val.title+'"/><br />Views '+val.viewCount+'</div>');

如何添加工具提示并从中删除按钮

1 个答案: