在線客服 浮動窗口

$(document).ready(function () {
    $loadXml();
    function $loadXml() {
        $.ajax({
            url: "xml/qq.xml",
            dataType: 'xml',
            type: 'GET',
            timeout: 2000,
            error: function (xml) {
                alert("加載XML 文件出錯！");
            },
            success: function (xml) {
                var divStr = "";
                divStr += "<div class=\"www_zzjs_net\">";
                divStr += "<div class=\"zzjs_net\"><img src=\"images/qq_r_20100811.gif\"></div>";
                divStr += "<div class=\"qqkf\">";
                $(xml).find("Table").each(function (i) {
                    var $name = $(this).attr("name");
                    divStr += "<div class=\"qqkfbt\">" + $name + "</div>";
                    divStr += "<div>";
                    $(this).find("Item").each(function (i) {
                        var $value = $(this).attr("value");
                        var $iName = $(this).attr("name");
                        var $type = $(this).attr("type");
                        divStr += "<div class=\"qqkfhm bgdh\">";
                        switch ($type) {
                            case "1":
                                divStr += "<a target=\"_blank\" href=\"tencent://message/?uin=" + $value + "\"><img border=\"0\" src=\"http://wpa.qq.com/pa?p=1:" + $value + ":4\" alt=\"點擊這裏給我發消息\" title=\"點擊這裏給我發消息\">" + $iName + "</a>";
                                break;
                            case "2":
                                divStr += "<a target=\"_blank\" href=\"http://amos.alicdn.com/msg.aw?v=2&uid=" + $value + "&site=cntaobao&s=2&charset=utf-8\" ><img border=\"0\" src=\"http://amos.alicdn.com/online.aw?v=2&uid=" + $value + "&site=cntaobao&s=2&charset=utf-8\" alt=\"點擊這裏給我發消息\" />" + $iName + "</a>";
                                break;
                            case "3":
                                divStr += $(this).attr("other");
                        }
                        divStr += "</div>";
                    });
                    divStr += "</div>";
                });
                divStr += "</div>";
                divStr += "</div>";
                $("body").append(divStr);
                $move();
                $(".zzjs_net").mouseover(function () {
                    $(this).hide();
                    $(".qqkf").show();
                });
                $(".qqkf").mouseleave(function () {
                    $(this).hide();
                    $(".zzjs_net").show();
                });
                $(".qqkfbt").click(function () {
                    if ($(this).next().css("display") == "block") {
                        $(this).next().css("display", "none");
                    }
                    else {
                        $(this).next().css("display", "block");
                    }
                });
            }
        });
    }
    $(window).bind("scroll", function () {
        $move();
    });
    function $move() {
        var $top = 40 + $(this).scrollTop() + "px";
        $(".www_zzjs_net").animate({ top: $top }, { duration: 1, queue: true });
    }
});

xml結構

<?xml version="1.0" encoding="utf-8"?>
<Menu>
  <Table name="售前諮詢" id="1">
    <Item value="183370267" name="QQ-張三" other="" id="11" o="1" type="1" />
    <Item value="183370267" name="QQ-張三" other="" id="12" o="2" type="1" />
    <Item value="183370267" name="QQ-張三" other="" id="13" o="3" type="3" />
  </Table>
  <Table id="3" name="技術支持">
    <Item value="183370267" name="QQ-張三" other="" id="31" o="1" type="1" />
    <Item value="183370267" name="QQ-張三" other="" id="32" o="2" type="1" />
    <Item value="183370267" name="QQ-張三" other="" id="33" o="3" type="1" />
    <Item value="183370267" name="QQ-張三" other="" id="34" o="4" type="2" />
  </Table>
  <Table id="4" name="在線客服">
    <Item value="111" name="111" other="&lt;a target=&quot;_blank&quot; href=&quot;http://wpa.qq.com/msgrd?v=3&amp;uin=183370267&amp;site=qq&amp;menu=yes&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;http://wpa.qq.com/pa?p=2:183370267:41&quot; alt=&quot;點擊這裏給我發消息&quot; title=&quot;點擊這裏給我發消息&quot;&gt;&lt;/a&gt;" id="42" o="2" type="3" />
    <Item value="111" name="111" other="&lt;a href=&quot;@163.com&quot;&gt;點擊發送郵件&lt;/a&gt;" id="44" o="4" type="3" />
  </Table>
</Menu>