禁用锚点链接单击+在HTML页面中拖动/使用内部链接滑动容器 [英] Disable anchor link click + drag in HTML page / Swipe a container with links inside

查看:135
本文介绍了禁用锚点链接单击+在HTML页面中拖动/使用内部链接滑动容器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想禁用链接上的点击+拖动

I'd like to disable the click + drag on a link

当您在网页的链接上按左键单击鼠标时,拖动这一个,您可以移动链接,并通过示例打开一个新的选项卡。我想在我的页面,javascript或css上禁用此功能。

When you press your left click of the mouse on a link in a web page, and your drag this one, you can move the link and, by example open a new tab with. I'd like to disable this on my page, javascript or css.

在网站500px上,他们禁用了它:

On the website 500px, they disabled it:

http://500px.com/photo/31922503

例如,在这张照片上,您可以点击链接(照片),但无法拖动链接。避免拖放图片也很好。

By example on this photo, you can click the link (the photo), but it's not possible to drag the link. It's also good to avoid the drag and drop of pictures.

因此,如果我禁用链接,我不需要禁用容器。

So if I disable the link, I need to not disable the container.

我禁用链接停止它们的dragstart(感谢KevinIsNowOnline):

I disable the link stopping dragstart on them (Thanks to "KevinIsNowOnline"):

$('div#multislides').on('dragstart', 'a', function () {
    return false;
});

但是,我需要拖动/滑动容器!所以我正在寻找一个解决方案。

But, I need to drag/swipe the container! So I'm looking for a solution to do that.

没有链接,有效:
http://jsfiddle.net/Ff3Ts/

使用链接,不起作用:
< a href =http://jsfiddle.net/Mfmfz/ =nofollow> http://jsfiddle.net/Mfmfz/

With links, doesn't work: http://jsfiddle.net/Mfmfz/

在示例中,您可以在没有链接的情况下拖动/滑动容器,但它不能使用链接。

On examples, you are able to drag/swipe the container when there is no link, but it's not working with links.

任何想法?

谢谢。

推荐答案

您好我检查了您发布的网站是否能够观察到您的内容希望实现。

Hi I have checked the site you posted an was able to observe what you want to achieve.

请参阅以下代码:

document.getElementById('notClickable').ondragstart = function() { return false; };
//upon start of drag of the selected image, it immediately returns false, or cancels the event.

看看这个 jsFiddle链接了解更多信息。

Check out this jsFiddle Link for more information.

这篇关于禁用锚点链接单击+在HTML页面中拖动/使用内部链接滑动容器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆