fullAvatarEditor 头像拍照

本组件需要安装Flash Player后才可使用，请从这里下载安装。

在线实例

实例演示

使用方法

 <div class="container" id="main">
            <div class="demo">
                <p id="swfContainer">
                    本组件需要安装Flash Player后才可使用，请从<a href="http://dl.pconline.com.cn/html_2/1/114/id=8122&pn=0.html" >这里</a>下载安装。
                </p>
                <button type="button" id="upload" style="display:none;margin-top:8px;">swf外定义的上传按钮，点击可执行上传保存操作</button>
            </div>
        </div>
        <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript" src="scripts/swfobject.js"></script>
        <script type="text/javascript" src="scripts/fullAvatarEditor.js"></script>
        <script type="text/javascript">
            swfobject.addDomLoadEvent(function() {
                //以下两行代码正式环境下请删除
                if (location.href.indexOf('http://') == -1)
                    alert('请于WEB服务器环境中查看、测试！\n\n既 http://*/simpleDemo.html\n\n而不是本地路径 file:///*/simpleDemo.html的方式');
                var swf = new fullAvatarEditor("fullAvatarEditor.swf", "expressInstall.swf", "swfContainer", {
                    id: 'swf',
                    upload_url: 'upload.php?userid=999&username=looselive', //上传接口
                    method: 'post', //传递到上传接口中的查询参数的提交方式。更改该值时，请注意更改上传接口中的查询参数的接收方式
                    src_upload: 2, //是否上传原图片的选项，有以下值：0-不上传；1-上传；2-显示复选框由用户选择
                    avatar_box_border_width: 0,
                    avatar_sizes: '100*100|50*50|32*32',
                    avatar_sizes_desc: '100*100像素|50*50像素|32*32像素'
                }, function(msg) {
                    switch (msg.code)
                    {
                        case 1 :
//                            alert("页面成功加载了组件！");
                            break;
                        case 2 :
//                            alert("已成功加载图片到编辑面板。");
                            document.getElementById("upload").style.display = "inline";
                            break;
                        case 3 :
                            if (msg.type == 0)
                            {
                                alert("摄像头已准备就绪且用户已允许使用。");
                            }
                            else if (msg.type == 1)
                            {
                                alert("摄像头已准备就绪但用户未允许使用！");
                            }
                            else
                            {
                                alert("摄像头被占用！");
                            }
                            break;
                        case 5 :
                            if (msg.type == 0)
                            {
                                if (msg.content.sourceUrl)
                                {
                                    alert("原图已成功保存至服务器，url为：\n" + 　msg.content.sourceUrl + "\n\n" + "头像已成功保存至服务器，url为：\n" + msg.content.avatarUrls.join("\n\n") + "\n\n传递的userid=" + msg.content.userid + "&username=" + msg.content.username);
                                }
                                else
                                {
                                    alert("头像已成功保存至服务器，url为：\n" + msg.content.avatarUrls.join("\n\n") + "\n\n传递的userid=" + msg.content.userid + "&username=" + msg.content.username);
                                }
                            }
                            break;
                    }
                }
                );
                document.getElementById("upload").onclick = function() {
                    swf.call("upload");
                };
            });
        </script>

云盘内容

注意：示例只是当前的内容，【下载】的是全部jQuery插件一起打包后的文件。