jQuery实现可拖拽的许愿墙效果【附演示源码下载】

本文实例讲述了jQuery实现可拖拽的许愿墙效果。分享给大家供大家参考，具体如下：

运行效果图如下：

这里简单介绍下功能点：

随机显示背景图或背景色 出现的位置随机 可以通过拖拽改变位置

好了，附上代码：

！doctype html html lang=' en ' head meta charset=' UTF-8 '/title许愿墙/title link rel='样式表href=' base。量滴CSS '/style # wish { height :650 px；余量：20px位置：相对；宽度宽度：960px}。心愿{后台： URL(心愿_ BG。png)无重复0 0；color: # 000高度：166 pxpadding:10px 20px 30px 20px宽度宽度：185px}。wish-close {后台： URL(wish _ close _ BG。png)无重复0 0；display:none位置：绝对；right :5 xtop :-5px；宽度：17 px高度：17 px}/style/header dy ul id=' wish ' Li 11111/Li Li 22222/Li Li 33333/Li Li 44444/Li Li 55555/Li/ul/body/html脚本src=' http : jquery。量滴js '/script script src=' http : jquery-ui。量滴js '/script script src=' http 3360 wish。js '/script script $(function())wish()；$('.愿望')。可拖动({containment:'#wish '，scroll : false })；});/script注意：

jqueryui需要加载可拖动的和缩放效果，可拖动是支持拖拽，而放缩效应是点击关闭的效果。

完整实例代码点击此处本站下载。

更多关于jQuery相关内容感兴趣的读者可查看本站专题： 《jQuery拖拽特效与技巧总结》 、 《jQuery常用插件及用法总结》 、 《jquery中Ajax用法总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jQuery扩展技巧总结》 、 《jQuery常见经典特效汇总》 、 《jQuery动画与特效用法总结》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。