zoukankan      html  css  js  c++  java
  • 网页右下角有广告图片,通过点击进行切换

    1、在页面中添加两个div:

    <div class="right_bottom01"><a href="#"></a></div>
    <div class="right_bottom02"><a href="#"></a></div>

    2、在样式中进行设置:(图片路径要注意)

    <style type="text/css">

    .right_bottom01 { 95px; height:170px; display:block; position:fixed; right:10px; bottom:100px; background:url(../images/01.png) no-repeat;_position: absolute;
    right: 10px;
    bottom: 100px;
    _bottom: "auto";
    cursor: pointer;}
    .right_bottom02 { 140px; height:238px; display:none; position:fixed; right:1px; bottom:100px; background:url(../images/02.png) no-repeat;_position: absolute;
    right: 10px;
    bottom: 100px;
    _bottom: "auto";
    cursor: pointer;}

    </style>

    3、通过js代码进行切换

    <script type="text/javascript">

    $(function()

    {

         $(".right_bottom01").bind("click",function(){wxSwitch(1);});
         $(".right_bottom02").bind("click",function(){wxSwitch(2);});

    }

    //切换方法

    function wxSwitch(f)
        {
            if(f==1)
            {
                   $(".right_bottom01").hide(); 
                   $(".right_bottom02").show();
            }
            else
            {
                   $(".right_bottom01").show(); 
                   $(".right_bottom02").hide();
            }
        }

    </script>

  • 相关阅读:
    C#调用WebService实现天气预报
    火狐完整版下载地址
    Unity3D 中 2D_Toolkit插件下载 和 导入方法
    给大家分享个 网站头像上传的 插件
    JQuery工具方法,实例方法
    ireport5.6.0 win10打不开
    JFreeChart 零散
    JS 类继承 原型继承
    技术电子书下载网址
    正则 变量替换
  • 原文地址:https://www.cnblogs.com/jirglt/p/3048799.html
Copyright © 2011-2022 走看看