时间戳

首页 > 解决方案 > 如何减小按钮的大小

javascript - 如何减小按钮的大小

问题描述

我有一些 JavaScript，它使我的整个页面可以通过我认为是容器元素的内容进行点击。但是，当我尝试减小它的大小，并减小相关小部件的大小时，甚至页脚也是可点击的。虽然页脚不会根据 JavaScript 代码进行切换，但它会在a href "#"用户尝试选择页脚中的元素/链接时切换到页面顶部。

那么我怎样才能让页脚停止可点击呢？页面本身似乎仅在单击其上的元素时才会做出反应，但几乎整个页脚区域都会做出反应href#

<a id="mni" href="#">
<div class="container4" onclick="myFunction(this)">
     <div class="nimageone">
          <img  src="http://4309.co.uk/wp-content/uploads/2020/05/IMG_20200509_165113-1-219x300.jpg" alt="" width="350" height="300" c.class="size-medium wp-image-14178" /></div>
     </div>
     <script>
         function myFunction(x){
              x.classList.toggle('change');
         }
     </script>
</div>

CSS

.change 
.nimageone img {display:none}

桌面在这里

标签： javascripthtmlcss

解决方案

您没有全面包含 HTML 元素的树结构。

您可以通过以下方式实现您想要做的事情。

    <div>
   <a id="mni" href="#">
   <div class="container4" 
     onclick="myFunction(this)">
    <div class="nimageone"><img 
    src="http://4309.co.uk/wp-  
   content/uploads/2020/05/IMG_20200509_165113-1- 
  219x300.jpg" alt="" width="350" height="300" class=" 
   size-medium wp-image-14178" /></div>
  </div>


 </a> //remember to close the <a> tag here before the 
footer item

 /////Your footer item can come below here 
<footer>
</footer>
</div>

推荐阅读