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

 更新时间:2011年08月03日 23:45:53   作者:  
功能终于告一段落了,实现了预期的功能。遇到了一个小麻烦,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实现非叠加式的搜索框提示效果

    jquery实现非叠加式的搜索框提示效果

    用JQUERY叠加两个INPUT框来实现登陆中需要输入的用户名、密码来实现提示与用户的输出,使用jquery在一个INPUT框中即可实现
    2014-01-01
  • 使用jQuery Rotare实现微信大转盘抽奖功能

    使用jQuery Rotare实现微信大转盘抽奖功能

    本文主要介绍使用jQuery Rotare实现微信大转盘抽奖功能,并附实例讲解,非常实用,有需要的朋友可以参考一下。
    2016-06-06
  • JQuery validate插件验证用户注册信息

    JQuery validate插件验证用户注册信息

    这篇文章主要为大家详细介绍了JQuery validate插件验证用户注册信息的具体代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-05-05
  • jQuery中on方法使用注意事项详解

    jQuery中on方法使用注意事项详解

    本文主要介绍jQuery中on方法使用注意事项。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • jQuery实现图片放大预览实现原理及代码

    jQuery实现图片放大预览实现原理及代码

    jQuery实现图片放大原理很简单,就是将图片显示的尺寸变大后放在浏览器的一个指定位置,从而实现图片的放大预览,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-09-09
  • jquery $.trim()方法使用介绍

    jquery $.trim()方法使用介绍

    $.trim(str)的作用是去掉字符串首尾空格,下面为大家介绍下其具体的使用
    2014-05-05
  • jquery实现清新实用的网页菜单效果

    jquery实现清新实用的网页菜单效果

    这篇文章主要介绍了jquery实现清新实用的网页菜单效果,涉及jquery通过鼠标事件控制页面元素的动态隐藏与显示实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • jQuery ui 1.7更新小结

    jQuery ui 1.7更新小结

    因为要给新员工进行培训jQuery.UI方面的内容,我之前学习的都是jquery.ui-1.6b的,现在的版本升级到jquery-ui-1.7.1,除了样式上有很大调整以外,API也有了很大的变化。
    2009-08-08
  • jquery parent和parents的区别分析

    jquery parent和parents的区别分析

    从字面上不难看出parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选
    2013-10-10
  • JQuery的attr 与 val区别

    JQuery的attr 与 val区别

    这篇文章主要介绍了JQuery的attr 与 val区别的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06

最新评论