.toolbar-item, .toolbar-layer {
    background: url(https://www.ttgood.com/common/image_all/toolbar.png) no-repeat;
}

.toolbar {
    position: fixed;
    right: 0px;
    bottom: 100px;
}

/*假设网页宽度为1200px，导航条在右侧悬浮transition-duration*/
.toolbar-item {
    display: block;
    width: 47px;
    height: 47px;
    margin-top: 1px;
    position: relative;
    -moz-transition: background-position 0.2s;
    -ms-transition: background-position 0.2s;
    -o-moz-transition: background-position 0.2s;
    -webkit-moz-transition: background-position 0.2s;
    transition: background-position 0.2s;
}

.toolbar-item:hover .toolbar-layer {
    opacity: 1;
    filter: alpha(opacity=50);
    transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
}

.toolbar-item-weixin {

    background-position: 0 -541px;
    margin-bottom: 9px;
    -moz-border-radius: 12px 0px 0px 9px; /* Gecko browsers */
    -webkit-border-radius: 12px 0px 0px 9px; /* Webkit browsers */
    border-radius: 12px 0px 0px 9px; /* W3C syntax */

}

.toolbar-item-weixin:hover {
    background-position: 0 -600px;

}

.toolbar-item-weixin .toolbar-layer {
    height: 212px;
    background-position: 0 -2px;
}

.toolbar-item-app {
    background-position: 0 -426px;

    margin-bottom: 9px;
    -moz-border-radius: 12px 0px 0px 12px; /* Gecko browsers */
    -webkit-border-radius: 12px 0px 0px 12px; /* Webkit browsers */
    border-radius: 12px 0px 0px 12px; /* W3C syntax */
}

.toolbar-item-app:hover {
    background-position: 0 -483px;
}

.toolbar-item-app .toolbar-layer {
    height: 194px;
    background-position: 0 -222px;
}


.toolbar-item-top {
    background-position: 0 -721px;
    margin-bottom: 5px;
    -moz-border-radius: 12px 0px 0px 12px; /* Gecko browsers */
    -webkit-border-radius: 12px 0px 0px 12px; /* Webkit browsers */
    border-radius: 12px 0px 0px 12px; /* W3C syntax */
}

.toolbar-item-top:hover {
    background-position: 0 -660px;
}

.toolbar-layer {
    position: absolute;
    right: 50px;
    bottom: -10px;
    width: 172px;
    opacity: 0;
    filter: alpha(opacity=0);
    transform-origin: 95% 95%;
    -moz-transform-origin: 95% 95%;
    -ms-transform-origin: 95% 95%;
    -o-transform-origin: 95% 95%;
    -webkit-transform-origin: 95% 95%;
    transform: scale(0.01);
    -moz-transform: scale(0.01);
    -ms-transform: scale(0.01);
    -o-transform: scale(0.01);
    -webkit-transform: scale(0.01);
    transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    -webkit-transition: all 1s;
}