jQuery + Flex 通过拖拽方式动态改变图片的代码


Posted in Javascript onAugust 03, 2011

代码如下:

function init() { 
if(swfobject.hasFlashPlayerVersion("10")){ 
var flashvars = {}; 
flashvars.xmlPath = "coffee"; 
flashvars.name = "coffee"; 
var params = {}; 
params.quality = "high"; 
params.wmode = "transparent"; 
var attributes = {}; 
attributes.id = "swf_editer"; 
swfobject.embedSWF("../img/swf/PhotoEditer2.swf","editarea","670","690","10.3" 
,"../img/swf/playerProductInstall.swf",flashvars,params,attributes); 
$( ".draggable" ).draggable({ revert: true, helper: "clone" }); 
$("body").bind("mousemove",getListener); 
} 
} 
var srcName = ""; 
var currentX = 0; 
var currentY = 0; 
var currentTop = 0; 
function setImgLocal(srcName) { 
bindDroppable(); 
this.srcName = srcName ; 
} 
function changeSwfImg() { 
if(srcName === "" || srcName === null){ 
return ; 
} 
var swf = swfobject.getObjectById("swf_editer"); 
var swfCoord = getSwfCoord(); 
var dom = {}; 
dom.name = srcName; 
dom.changeFlg = 0; 
//********************************* 
var tmp1 = swfCoord.domY - 0; 
tmp2 = swfCoord.domHeight - 220; 
//********************************* 
if((currentTop + currentY) > (swfCoord.domY + 100) 
&& (currentTop + currentY) < (tmp1 + tmp2)) 
{ 
dom.changeFlg = currentX - swfCoord.domX < swfCoord.domWidth/2 ? 1 : 2; 
} 
swf.FlexManager(dom); 
} 
function bindDroppable() { 
$("#swf_editer").droppable({ 
accept: "#dv_draggables img", 
drop: function(event, ui) { 
changeSwfImg(); 
} 
}); 
} 
function getListener(event) { 
currentX = event.clientX; 
currentY = event.clientY; 
currentTop = document.documentElement.scrollTop ; 
} 
function getSwfCoord() { 
var swf = swfobject.getObjectById("swf_editer"); 
var dom = {}; 
dom.domX = 0 , dom.domY = 0; 
dom.domWidth = swf.width; 
dom.domHeight = swf.height; 
while(swf.offsetParent) { 
dom.domX += swf.offsetLeft; 
dom.domY += swf.offsetTop; 
swf = swf.offsetParent; 
} 
return dom; 
}
Javascript 相关文章推荐
jQuery 表格插件整理
Apr 27 Javascript
超简单的jquery的AJAX用法
May 10 Javascript
jQuery焦点图插件SaySlide
Dec 21 Javascript
javascript插件开发的一些感想和心得
Feb 28 Javascript
Easyui笔记2:实现datagrid多行删除的示例代码
Jan 14 Javascript
vue中各组件之间传递数据的方法示例
Jul 27 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
Dec 05 Javascript
js实现动态添加上传文件页面
Oct 22 Javascript
highCharts提示框中显示当前时间的方法
Jan 18 Javascript
JavaScript实现简单计算器
Mar 19 Javascript
javascript 代码是如何被压缩的示例代码
May 06 Javascript
vue实现按钮切换图片
Jan 20 Vue.js
JavaScript 一道字符串分解的题目
Aug 03 #Javascript
JavaScript中去掉数组中的重复值的实现方法
Aug 03 #Javascript
JavaScript 大数据相加的问题
Aug 03 #Javascript
推荐11款jQuery开发的复选框和单选框美化插件
Aug 02 #Javascript
JS 控制小数位数的实现代码
Aug 02 #Javascript
用JS判别浏览器种类以及IE版本的几种方法小结
Aug 02 #Javascript
JQuery+JS实现仿百度搜索结果中关键字变色效果
Aug 02 #Javascript
You might like
新手配置 PHP 调试环境(IIS+PHP+MYSQL)
2007/01/10 PHP
php学习之数据类型之间的转换介绍
2011/06/09 PHP
基于PHP输出缓存(output_buffering)的深入理解
2013/06/13 PHP
jquery.fileEveryWhere.js 一个跨浏览器的file显示插件
2011/10/24 Javascript
解决js正则匹配换行问题实现代码
2012/12/10 Javascript
分析js闭包引起的事件注册问题
2016/03/29 Javascript
jQuery validate验证插件使用详解
2016/05/11 Javascript
简单理解vue中Props属性
2016/10/27 Javascript
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
2020/11/24 Javascript
Angular使用操作事件指令ng-click传多个参数示例
2018/03/27 Javascript
Vue中控制v-for循环次数的实现方法
2018/09/26 Javascript
微信小程序实现页面分享onShareAppMessage
2019/08/12 Javascript
JavaScript判断数组类型的方法
2019/10/23 Javascript
JS面向对象编程实现的Tab选项卡案例详解
2020/03/03 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
2020/07/17 Javascript
基于Vue.js+Nuxt开发自定义弹出层组件
2020/10/09 Javascript
[51:28]EG vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/16 DOTA
pandas.dataframe中根据条件获取元素所在的位置方法(索引)
2018/06/07 Python
浅析python中numpy包中的argsort函数的使用
2018/08/30 Python
浅谈python连续赋值可能引发的错误
2018/11/10 Python
Python查找最长不包含重复字符的子字符串算法示例
2019/02/13 Python
PyCharm-错误-找不到指定文件python.exe的解决方法
2019/07/01 Python
python调用其他文件函数或类的示例
2019/07/16 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
简单了解python中的f.b.u.r函数
2019/11/02 Python
Django admin禁用编辑链接和添加删除操作详解
2019/11/15 Python
Python实现RGB与HSI颜色空间的互换方式
2019/11/27 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
聊聊python中的异常嵌套
2020/09/01 Python
Eyeko美国:屡获殊荣的睫毛膏、眼线笔和眉妆
2018/07/05 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
init进程的作用
2012/04/12 面试题
小学生操行评语
2014/04/22 职场文书
公司合并协议书范本
2014/09/30 职场文书
在pycharm中无法import所安装的库解决方案
2021/05/31 Python
springboot @ConfigurationProperties和@PropertySource的区别
2021/06/11 Java/Android