Javascript 有人能帮我修改代码吗

我有一个代码，用于将横幅并排地浮动在底部左侧和右侧，当我单击左侧横幅时没有发生任何事情，但当我单击右侧横幅时，左侧的横幅自动关闭，当我再次点击右横幅时，它会将你引导到其他网站，但横幅会消失

我的问题是：

如何使左，右工作正常，左横幅可以点击并直接到目标网站，当我点击右横幅不关闭左横幅

点击横幅后，横幅不会自动关闭

这是我网站上的代码：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#bottomads").click(function(){
    $(this).hide();
  });
});
</script>
<script>
$(document).ready(function(){
  $("#bottomads2").click(function(){
    $(this).hide();
  });
});
</script>

<div style='width:100%;margin:auto;text-align:center;display:scroll;position:fixed;bottom:5px;right: 270px;z-index:999;-webkit-transform:translateZ(0);' id="bottomads">
<a href="http://example.com" target="_blank" rel="nofollow"><img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" height="60px" width="468px" /></a>
<a href="javascript:hidefreebie();"><img src="https://drive.google.com/uc?export=download&id=0B_YE_mOyP6psSG5qQk9yRG5hcWs" style="margin-left: -520px;margin-top: 45px;position: absolute;middle: 20px;top: 0;" border="0"></a>
</div>

<div style='width:100%;margin:auto;text-align:center;display:scroll;position:fixed;bottom:5px;left: 270px;z-index:999;-webkit-transform:translateZ(0);' id="bottomads2">
<a href="http://example.com" target="_blank" rel="nofollow"><img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" height="60px" width="468px" /></a>
<a href="javascript:hidefreebie();"><img src="https://drive.google.com/uc?export=download&id=0B_YE_mOyP6psSG5qQk9yRG5hcWs" style="margin-right: 25px;margin-top: 45px;position: absolute;middle: 20px;top: 0;" border="0"></a>
</div>

$（文档）.ready（函数（）{
$（“#底部广告”）。单击（函数（）{
$（this.hide（）；
});
});
$（文档）.ready（函数（）{
$（“#bottomads2”）。单击（函数（）{
$（this.hide（）；
});
});

我希望我能解释清楚，谢谢你的回答

您的bottomads2已覆盖在bottomads上

原因同上

建议您在提出下一个问题之前进行更多的测试。

您的问题如图所示。bottomads2的div在bottomads上

这个问题的解决办法是：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
$(document).ready(function() {

    $("#bottomads").click(function() {
        $(this).hide();
        $("#bottomads").style('width', '100%');
    });

    $("#bottomads2").click(function() {
        $(this).hide();
    });

});
</script>

<div style='width:100%;margin:auto;text-align:center;display:scroll;position:fixed;bottom:5px;right: 270px;z-index:999;-webkit-transform:translateZ(0);' id="bottomads">
    <a target="_blank" rel="nofollow"><img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" height="60px" width="468px" /></a>
    <a href="javascript:hidefreebie();"><img src="https://drive.google.com/uc?export=download&id=0B_YE_mOyP6psSG5qQk9yRG5hcWs" style="margin-left: -520px;margin-top: 45px;position: absolute;middle: 20px;top: 0;" border="0"></a>
</div>
<div style='text-align:center;display:scroll;position:fixed;bottom:5px;left: 700px;z-index:999;-webkit-transform:translateZ(0);' id="bottomads2">
    <a target="_blank" rel="nofollow"><img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" height="60px" width="468px" /></a>
    <a href="javascript:hidefreebie();"><img src="https://drive.google.com/uc?export=download&id=0B_YE_mOyP6psSG5qQk9yRG5hcWs" style="margin-right: 25px;margin-top: 45px;position: fixed;middle: 20px;top: 0;" border="0"></a>
</div>

那么这条线是这样的：

<div style='width:100%;margin:auto;right: 270px;' id="bottomads" class="bottomads">

是否愿意解释如何使其不重叠或有任何好的代码？谢谢谢谢你的回答我会尽力说服你的欢迎：）@juicebyah

<div style='width:100%;margin:auto;right: 270px;' id="bottomads" class="bottomads">