Question

我有一个示例代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <a class='dragitem' href='#' draggable='true'><img src="myimage.gif" width=12px height=12px border=0px padding="0px 0px 0px 0px" align=left>Drag Me</a>"
  </body>
</html>

上方的项目在Firefox中被放大，同时拖动项目＆amp;在其他浏览器（IE和Chrome）中，它没有得到扩大。如果我删除了标记，它在所有浏览器中都按预期工作（项目没有放大）。我拖动时附加了图像。

请告诉我，如何在拖动时阻止此项在Firefox中放大？

Answer 1

首先，根据W3Schools，您必须知道链接和图片可以默认拖动。您不需要为您的链接添加属性draggable="true"。关于Firefox行为，我尝试使用您的代码并发现它是因为您的链接中的图像拖拽效果扩大了内容的大小。使用此代码，您将无法使用它（我将图像放在链接之外）：

<body>
  <a class='dragitem' href='#'>Drag Me</a>
  <img src="myimage1.gif" width=12px height=12px border=0px padding="0px 0px 
  0px 0px" align=left>
</body>

你可以尝试，你将不再有对Firefox的扩大效果。现在的问题是你的形象的目的是什么？为什么要加上链接HTML结构？我希望它会对你有所帮助。

Answer 2

它可能是Firefox的错误或功能。如果你使用一个较大的拖拽对象，它不会调整它的大小，但如果它太小，它会假设你需要它更大才能看到它或类似的东西。既然您必须使用js / jquery作为逻辑，为什么不使用jQuery UI's draggable呢？您可以更好地控制拖动和样式。

＆＃13;

$(".dragitem").draggable({
    addClasses: false,
    revert: true
});

＆＃13;

.ui-draggable-dragging a{
  color:red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>


<a class="dragitem" style="position:absolute" href='#' ><img src="http://jsfiddle.net/img/logo.png" width=22px height=18px border=0px padding="0px 0px 0px 0px" align=left />Drag Me</a>

＆＃13;

在Firefox

2 个答案: