预览图像只读/禁用

Question

在我的页面上，我希望查看特定图片disable / readonly。不可点击

Codepan：CODEPEN

<li><a href=""><img height="50" width="50" src="http://www.imge.net/wp-content/uploads/2010/11/imge_net-37.jpg"></a>

的CSS：

img{
    -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

但它没有任何改变。 有什么建议吗？

更新：

您对此有何看法：

document.getElementbyId('idofimg').disabled = true

Answer 1

这很简单。如果您希望图像不可点击，只需使用这个简单的css类

.avoid-clicks {
    pointer-events: none;
}

编辑：用法

在为样式表定义css类之后，只需使用下面的

<li><a href=""><img class="avoid-clicks" height="50" width="50" src="http://www.imge.net/wp-content/uploads/2010/11/imge_net-37.jpg"></a>

Answer 2

如果删除锚标记，则只能查看

<li><a href=""><img height="50" width="50" src="http://www.imge.net/wp-content/uploads/2010/11/imge_net-37.jpg"></a>

替换为此

<li><img height="50" width="50" src="http://www.imge.net/wp-content/uploads/2010/11/imge_net-37.jpg"></li>

Answer 3

如果您不想删除<a>代码，那么您可以这样做

更改此

<a href=""><img>...</a>

到此

<a><img>...</a>