Jquery中文网 www.jquerycn.cn
Jquery中文网 >  jQuery  >  jquery 教程  >  正文 jQuery + Flex 通过拖拽方式动态改变图片的代码

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

发布时间:2013-06-25   编辑:www.jquerycn.cn
功能终于告一段落了,实现了预期的功能。遇到了一个小麻烦,js 会把某些变量( 如果你是通过对象的方式传递的,将在传递之后丢失类型信息 ,后面*号部分)
功能终于告一段落了,实现了预期的功能。遇到了一个小麻烦,js 会把某些变量( 如果你是通过对象的方式传递的,将在传递之后丢失类型信息 ,后面*号部分) 代码如下:
复制代码 代码如下:

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;
}

您可能感兴趣的文章:
jQuery + Flex 通过拖拽方式动态改变图片的代码
HTML5 DragEvent接口的实例讲解
H5实现拖拽排序的代码
使用h5实现react拖拽排序组件的方法(附代码)
HTML5的WebGL3D档案馆图书可视化管理系统的实现
简单的jquery拖拽排序效果实现代码
jquery页面拖拽并保存到cookie实例分享
JQuery UI的拖拽功能实现方法小结
如何使用jQuery Draggable和Droppable实现拖拽功能
CSS3 Flexbox该怎么使用?

[关闭]