फाउंडेशन 6 ऑफ-कैनवास बंद नहीं - जावास्क्रिप्ट, ज़र्ब-फाउंडेशन

मेरे पास निम्न लिंक है: http://www.alessandrosantese.com/test/aldemair-productions/

जब आप बीच में स्किप बटन पर क्लिक करते हैं तो आप अगली स्लाइड पर पहुंच जाएंगे, जिसमें कैनवास को बंद करने के लिए FOundation 6 है।

मेरा हेडर जिसमें ऑफ-कैनवास टॉगल करने के लिए बटन शामिल है, ऑफ कैनवास मेनू के बाहर है, ऐसा लगता है:

        <header class="fixed close">
<div class="hamburger" data-toggle="sth">
<button type="button">
<span></span>
<span></span>
<span></span>
</button>
<span class="menu">Menu</span>
</div>
<div class="logo">
<h1>Aldemar</h1>
<span>productions</span>
</div>
<span class="mail-icon float-right" data-open="contact-us">
</span>
</header>

ऑफ-कैनवास मेनू को बंद करने के लिए मेरे पास निम्नलिखित जेएस हैं:

$(".hamburger").on("click", function(e){
e.preventDefault();
if($("header").hasClass("close")){
$("header").removeClass("close").addClass("open");
$(this).find("button").toggleClass("open");
$("body").addClass("block-view");
}
else {
$(".off-canvas").foundation("close");
$("header").removeClass("open").addClass("close");
$(this).find("button").toggleClass("open");
$("body").removeClass("block-view");
$("#sth").foundation("close");
}
});

लेकिन यह काम नहीं करता है: $ ("# sth")। नींव ("बंद"); यह मेनू बंद नहीं करता है

उत्तर:

ऐसा लगता है div कक्षा के साथ off-canvas-wrapper-inner अभी भी कक्षाएं हैं is-off-canvas-open तथा is-open-left जब मेनू बंद हो जाता है और हेडर बाईं ओर स्लाइड करता है। बाद में उन वर्गों को हटाने का प्रयास करें $("header").removeClass("open").addClass("close").

वैकल्पिक रूप से, यदि दस्तावेज़ों के लिए फाउंडेशन ऑफ-कैनवास कक्षाएं स्थापित करना संभव है (http://foundation.zurb.com/sites/docs/off-canvas.html), आपको मेनू टॉगल करने के लिए एक कस्टम ईवेंट लिखने की आवश्यकता नहीं है।

तो "डेटा-टॉगल =" sth "को हटाने के बाद मैंने अपने जेएस को निम्नानुसार अपडेट किया है:

$(".hamburger").on("click", function(e){
e.preventDefault();
if($("header").hasClass("close")){
$("header").removeClass("close").addClass("open");
$(this).find("button").toggleClass("open");
$("body").addClass("block-view");
$("#sth").foundation("open");
}
else {
$(".off-canvas").foundation("close");
$("header").removeClass("open").addClass("close");
$(this).find("button").toggleClass("open");
$("body").removeClass("block-view");
$("#sth").foundation("close");
}
});

मुझे मैन्युअल रूप से मेनू खोलना और बंद करना पड़ा