0

Does anyone know of a way to make an 'fa-image' not draggable and not selectable, at the same time?

I have this surface displayed in 'fa-container-surface' and want to disable image selection because of scroll and drag and drop doesn't work if popup appear to save image.

<fa-image-surface   fa-image-url="{{tile.image}}"
                    fa-size="[60, 40]"
                    class="hexagon-tile-img unselectable">
</fa-image-surface>

I tried to set this css :

.unselectable {
    /* For Opera and <= IE9, we need to add unselectable="on" attribute onto each element */
    /* Check this site for more details: http://help.dottoro.com/lhwdpnva.php */
    -moz-user-select: none; /* These user-select properties are inheritable, used to prevent text selection */
    -webkit-user-select: none;
    -ms-user-select: none; /* From IE10 only */
    user-select: none; /* Not valid CSS yet, as of July 2012 */

    -webkit-user-drag: none; /* Prevents dragging of images/divs etc */
    user-drag: none;

}

But this doesn't work on chrome 38 webbrowser or Windows Phone 8.1 browser. Image disappear because of next error:

Syntax Error: Token 'unselectable' is an unexpected token at column 18 of the expression [hexagon-tile-img unselectable] starting at [unselectable]

In HTML, I know that we can set "unselectable='on'" or "draggable='false'" on 'img', but if I try to do it on 'fa-image-surface' attributes are not considered.

Does anyone have an idea to do it in famo.us/Angular project?

4

1 回答 1

0

唯一应用于您的 CSS 类hexagon-tile-img- 尝试添加unselectable到 class 属性，只是为了测试它是否可以在img元素上正常工作。

在您的样式表中，您可以尝试使用.unselectable > img基本上将不可选择的规则应用于img容器中的子元素。

此外，不要指望 famo.us 目前可以在 IE 上工作，因为 IE 尚未实现 preserve-3d，这对于将 3d 转换应用于子元素至关重要。

于 2014-11-03T10:16:58.553 回答