js悬浮在线咨询

.w100 {

 width: 100%;

 margin: 0px auto;

 float: left;

 background-color: #000;

}

.main {

 width: 1200px;

 margin: 0px auto;

 line-height: 22px;

}

.xfqq {

        border-radius: 5px;

        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);

        margin: 5px auto;

        line-height: 40px;

        position: fixed;

        z-index: 999999;

        text-align: left;

        top: 30%;

        margin-left:20px;

    }

.xfqqtxt {

    background: #000 none repeat scroll 0% 0%;

    opacity: 0.8;

    width:220px;

    height:301px;

    float:left;

    border:1px solid #ccc;

    text-align:center;

}

.xfqqtxt span {

    float:left;

    width:220px;

    color:#ccc;

}

 

<script type="text/javascript">

    function onover() {

        var hidexx = document.getElementById('hidexx');

        var showxx = document.getElementById('showxx');

        var xfxx = document.getElementById('xfxx');

        hidexx.style.display = "block";

        showxx.style.display = "none";

        xfxx.style.display = "block";

    }

    function onout() {

        var hidexx = document.getElementById('hidexx');

        var showxx = document.getElementById('showxx');

        var xfxx = document.getElementById('xfxx');

        hidexx.style.display = "none";

        showxx.style.display = "block";

        xfxx.style.display = "none";

    }

</script>

 

<div class="w100">

        <div class="main">

            <div class="xfqq">

                <div onmousedown="onover()" id="showxx">

                    <img src="{APP_PATH}statics/images/web/xfqq.jpg" alt="服务热线" width="48" height="48" border="0" />

                </div>

                <div onmousedown="onout()" id="hidexx" style="display: none;">

                    <img src="{APP_PATH}statics/images/web/xfqq.jpg" alt="服务热线" width="48" height="48" border="0" />

                </div>

                <div class="xfqqtxt" id="xfxx" style="display: none;">

                    <span>服务热线</span>

                    <hr />

                    <span>0317-999999999</span>

                    <img src="{APP_PATH}statics/images/web/weixin.jpg" alt="扫一扫，加我微信" width="142" height="139" border="0" />

                    <span>扫一扫，加我微信</span>

                </div>

            </div>

        </div>

    </div>