双击图像功能

Double click image function

本文关键字：功能图像双击更新时间：2023-09-26

有人可以帮助我创建一个简单的脚本吗，当有人双击图片时，按钮{LikeButton color="grey"}将被激活，然后心形图片将褪色。

这是我的照片块部分代码：

{block:Photo}<div class="containerimg">
                <span class="font-a"><a href="{Permalink}">{block:Date} {Month} {DayOfMonth}, {Year}{/block:Date}</a><br/><a href="{Permalink}">{NoteCountWithLabel}</a><br/>{block:HasTags} {block:Tags} <a href="{TagURL}">#{Tag}</a> {/block:Tags} {/block:HasTags}</span>
                    <div class="post photo">
                        <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
                        {block:Caption}
                            <div class="caption">{Caption}</div>
                        {/block:Caption}

                    </div>
                    <div class="status">
                    {block:RebloggedFrom} 
                    <img src="{ReblogParentPortraitURL-24}" style="border: 1px solid rgba(0,0,0,.15);" /> <a href="{ReblogParentURL}" style="position: absolute; padding: 5px 0px 0px 10px;">{ReblogParentName}</a>
                    {/block:RebloggedFrom}
                    {block:NotReblog} 
                    <img src="{PortraitURL-24}" style="border: 1px solid rgba(0,0,0,.15);" /> <a href="{Permalink}" style="position: absolute; padding: 5px 0px 0px 10px;">{Name}</a>
                    {/block:NotReblog}
                    <div class="reblogg">
                    {LikeButton color="grey"}&nbsp;&nbsp;{ReblogButton color="grey"}
                    </div>
                    </div>
                    </div>
                {/block:Photo}

您可以尝试像这样使用dblclick：

$(document).ready(function(){
    $('img').dblclick(function(){
        // do something
        alert('Picture fade out...')
        $(this).fadeOut().slow();
    });
});

你可以在jsfiddle上尝试一下

试试这个：

 $('#yourPictureID').dblclick(function{ 
   $('#LikeButtonID').attr("disable","false");
   $('#heartPictureID').css("opacity","1");
 });