Закрыть меню, щелкнув снаружи

D3v4 answer

Если вы ищете то же самое, но с D3 v4,

var zoom = d3.zoom().on("zoom", zooming);

vis = svg.append("svg:svg")
     .attr("width", width)
     .attr("height", height)
     .call(zoom) // here
     .call(zoom.transform, d3.zoomIdentity.translate(100, 50).scale(0.5))
     .append("svg:g")
     .attr("transform","translate(100,50) scale(.5,.5)");
0
задан Zobia Kanwal 21 March 2019 в 22:37
поделиться

1 ответ

Есть много способов, один, если использовать общее событие onclick в вышестоящем элементе. Вот пример:

function myFunction() {
      var x = document.getElementById("myLinks");
      if (x.style.display === "block") {
        x.style.display = "none";
      } else {
        x.style.display = "block";
      }
    }
    
window.onclick = myFunction;
<div class="topnav">
    <a href="#home" class="nt"><strong>NELSON TRAILS</strong></a>
    <div id="myLinks">
    <a class="sub">SHORT WALKS</a>
    <a class="sub">DAY TRIPS</a>
    <a class="sub">MULTI-DAY</a>
    <a class="sub">MAP EXPLORER</a> 
    <a class="sub">TRAIL SEARCH AND FILTER</a>
    <a class="sub">TRAIL ALERTS</a>
    <a class="sub">ABOUT</a>
 </div>
 <a class="icon" onclick="myFunction()"><i class="fa fa-bars">Menu</i></a>
</div>

Конечно window не очень хороший элемент для использования, поскольку polutes JS пространство имен. Поместите это в элемент, который находится над вашим меню и охватывает всю страницу. Вы можете использовать корневой div или что-то в этом роде.

0
ответ дан Nelson Teixeira 21 March 2019 в 22:37
поделиться
Другие вопросы по тегам:

Похожие вопросы: