《HTML5 开发实例大全》——1.26 使用鼠标光标拖动网页中的文字

本节书摘来自异步社区《HTML5 开发实例大全》一书中的第1章，第1.26节,作者： 张明星 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.26 使用鼠标光标拖动网页中的文字

实例说明

在HTML 5 中，可以使用属性“draggable”设置是否允许用户拖动网页中的元素。属性“draggable”有如下两个值。

true：表示鼠标光标选中元素后，可以进行拖动的操作。 false：表示鼠标光标选中元素后，不能进行拖动的操作，该属性值为默认值。

在本实例中，使用 article 元素显示一段文字，并设置 article 元素的属性“draggable”值为“true”，当用户选中这段文字移动鼠标光标时，可以实现拖动的效果。

具体实现

使用Dreamweaver创建一个名为“026.html”的文件，具体代码如下所示：

 !DOCTYPE html 

 html 

 head 

 meta charset="utf-8" / 

 title 使用draggable属性 /title 

 link href="css.css" rel="stylesheet" type="text/css" 

 /head 

 body 

 h5 元素的拖动属性 /h5 

 article draggable="true" 

 这是一段可以拖动的文字,选中后进行拖动。

 /article 

 /body 

 /html 

在上述代码中，为了实现 article 元素的可拖动效果，必须在元素中添加一个“draggable”属性，并将该属性的值设置为“true”，表示该元素可以进行拖动，实现过程如代码中所示。设置完成后，在浏览器中就可以选中该元素，进行拖动的操作，执行效果如图1-45所示。

基于HTML5的拖动排序 好久没有写文章，不知道写什么好。突然想到拖动这个API。之前使用 jQuery UI 实例 - 排序（Sortable）去实现了一个拖动排序，也有用jquery.gridly.js实现的一个拖动排序。
Android项目实战（十四）：TextView显示html样式的文字 原文:Android项目实战（十四）：TextView显示html样式的文字 项目需求： TextView显示一段文字，格式为：白雪公主（姓名，字数不确定）向您发来了2（消息个数，不确定）条消息 这段文字中名字和数字的长度是不确定的，还要求名字和数字各自有各自的颜色。
异步社区 异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区，也是国内领先的IT专业图书社区，致力于优质学习内容的出版和分享，实现了纸书电子书的同步上架，于2015年8月上线运营。公众号【异步图书】，每日赠送异步新书。