Javascript DIV-won';不要一直向下滚动
我又回来了,对我那个厚颜无耻的菜单提出了另一个问题。我终于完成了它,它在功能上完全正常,直到我在手机上检查它。当我展开所有菜单时,div将只滚动几个像素。我认为我的问题来自这样一个事实:一些元素有Javascript DIV-won';不要一直向下滚动,javascript,html,css,Javascript,Html,Css,我又回来了,对我那个厚颜无耻的菜单提出了另一个问题。我终于完成了它,它在功能上完全正常,直到我在手机上检查它。当我展开所有菜单时,div将只滚动几个像素。我认为我的问题来自这样一个事实:一些元素有溢出:隐藏,并且主体和html高度设置为100%(在另一个文件中,即索引中。我提供的代码来自菜单文件,一个单独的文件)。这是我的分数: <div class="wrapper"> <img class="logo" alt="Logo" src="pictures\sigla.
溢出:隐藏,并且主体和html高度设置为100%(在另一个文件中,即索引中。我提供的代码来自菜单文件,一个单独的文件)。这是我的分数:
<div class="wrapper">
<img class="logo" alt="Logo" src="pictures\sigla.png"></img>
<div class="meniu">
<div class="dropdown-meniu">
<div id="buton-meniu" class="buton-meniu" onclick="myFunction(this)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<div id="dropdown-meniu-content" class="dropdown-meniu-content">
<div class="dropdown">
<div id="buton-ferestre" class="buton" onclick="expansiune_ferestre()">Ferestre<div id="arrow-up-ferestre" class="arrow-up"></div></div>
<div id="dropdown-ferestre-content" class="dropdown-content">
<ul type="none">
<li><a class="text">S3000</a></li>
<li><a class="text">S8000</a></li>
<li><a class="text">S9000</a></li>
<li><a class="text">Vitraj</a></li>
</ul>
</div>
</div>
<div class="dropdown">
<div id="buton-usi" class="buton" onclick="expansiune_usi()">Usi<div id="arrow-up-usi" class="arrow-up"></div></div>
<div id="dropdown-usi-content" class="dropdown-content">
<ul type="none">
<span><li><a class="text">Intrare</a></li>
<li><a class="text">Siguranta</a></li>
<li><a class="text">Garaj</a></li>
<li><a class="text">Glisante</a></li></span>
<span><li><a class="text">Armonice</a></li></span>
</ul>
</div>
</div>
<div class="buton-s">Aerisire</div>
<div class="dropdown">
<div id="buton-sticla" class="buton" onclick="expansiune_sticla()">Sticla<div id="arrow-up-sticla" class="arrow-up"></div></div>
<div id="dropdown-sticla-content" class="dropdown-content">
<ul type="none">
<li><a class="text">Termopan</a></li>
<li><a class="text">Tripan</a></li>
<li><a class="text">Sablata</a></li>
<li><a class="text">Anti-Efractie</a></li>
</ul>
</div>
</div>
<div class="dropdown">
<div id="buton-feronerie" class="buton" onclick="expansiune_feronerie()">Feronerie<div id="arrow-up-feronerie" class="arrow-up"></div></div>
<div id="dropdown-feronerie-content" class="dropdown-content">
<ul type="none">
<li><a class="text">G.U</a></li>
</ul>
</div>
</div>
<div class="dropdown">
<div id="buton-tehnici" class="buton" onclick="expansiune_tehnici()">Tehnici umbrire<div id="arrow-up-tehnici" class="arrow-up"></div></div>
<div id="dropdown-tehnici-content" class="dropdown-content">
<ul type="none">
<span><li><a class="text">Rulouri</a></li>
<li><a class="text">Rolete</a></li>
<li><a class="text">Jaluzele</a></li>
<li><a class="text">Obloane</a></li></span>
<span><li><a class="text">Plase Insecte</a></li></span>
</ul>
</div>
</div>
<div class="buton-s">Contact</div>
</div>
</div>
</div>
</div>
这是我非常草率的JavaScript。如果你有任何简化它的建议,我会非常高兴,特别是在我看来,扩展菜单元素的代码非常草率,我认为我可以简化它,但我不知道如何做
if (navigator.appName == 'Microsoft Internet Explorer' || !!(navigator.userAgent.match(/Trident/) || navigator.userAgent.match(/rv:11/)) || (typeof $.browser !== "undefined" && $.browser.msie == 1))
{
alert("Va rugam sa folositi alt browser cu site-ul nostru!Internet Explorer este un browser cu probleme de securitate, iar noi nu il suportam, asa ca veti fi redirectionati.Va multumim!");
window.location.replace("http://www.google.com");
}
var button = document.querySelector('#buton-meniu');
var content = document.querySelector('#dropdown-meniu-content');
button.addEventListener('click', function(e) {
e.stopPropagation();
e.currentTarget.classList.toggle('change');
content.classList.toggle('show');
}, true)
document.addEventListener('click', function() {
if (content.classList.contains('show')) {
content.classList.remove('show');
button.classList.remove('change');
}
})
content.addEventListener('click', function(e) {
e.stopPropagation();
})
function expansiune_ferestre() {
document.getElementById("dropdown-ferestre-content").classList.toggle("expand");
document.getElementById("arrow-up-ferestre").classList.toggle("rotate");
}
function expansiune_usi() {
document.getElementById("dropdown-usi-content").classList.toggle("expand");
document.getElementById("arrow-up-usi").classList.toggle("rotate");
}
function expansiune_sticla() {
document.getElementById("dropdown-sticla-content").classList.toggle("expand");
document.getElementById("arrow-up-sticla").classList.toggle("rotate");
}
function expansiune_feronerie() {
document.getElementById("dropdown-feronerie-content").classList.toggle("expand");
document.getElementById("arrow-up-feronerie").classList.toggle("rotate");
}
function expansiune_tehnici() {
document.getElementById("dropdown-tehnici-content").classList.toggle("expand");
document.getElementById("arrow-up-tehnici").classList.toggle("rotate");
}
这是代码的JSFIDLE:
感谢您的时间,我希望我的问题(如果您将查看javascript代码的请求计算在内)不会太傻 这可能属于SE站点。JSFIDLE是错误的。我已经更新了它@bharat guptaI正在投票结束这个问题,因为它不属于主题,因为它更适合于代码审查。@删除“dropdown meniu content”类中有一个min height
。卸下它,卷轴就可以正常工作了。
if (navigator.appName == 'Microsoft Internet Explorer' || !!(navigator.userAgent.match(/Trident/) || navigator.userAgent.match(/rv:11/)) || (typeof $.browser !== "undefined" && $.browser.msie == 1))
{
alert("Va rugam sa folositi alt browser cu site-ul nostru!Internet Explorer este un browser cu probleme de securitate, iar noi nu il suportam, asa ca veti fi redirectionati.Va multumim!");
window.location.replace("http://www.google.com");
}
var button = document.querySelector('#buton-meniu');
var content = document.querySelector('#dropdown-meniu-content');
button.addEventListener('click', function(e) {
e.stopPropagation();
e.currentTarget.classList.toggle('change');
content.classList.toggle('show');
}, true)
document.addEventListener('click', function() {
if (content.classList.contains('show')) {
content.classList.remove('show');
button.classList.remove('change');
}
})
content.addEventListener('click', function(e) {
e.stopPropagation();
})
function expansiune_ferestre() {
document.getElementById("dropdown-ferestre-content").classList.toggle("expand");
document.getElementById("arrow-up-ferestre").classList.toggle("rotate");
}
function expansiune_usi() {
document.getElementById("dropdown-usi-content").classList.toggle("expand");
document.getElementById("arrow-up-usi").classList.toggle("rotate");
}
function expansiune_sticla() {
document.getElementById("dropdown-sticla-content").classList.toggle("expand");
document.getElementById("arrow-up-sticla").classList.toggle("rotate");
}
function expansiune_feronerie() {
document.getElementById("dropdown-feronerie-content").classList.toggle("expand");
document.getElementById("arrow-up-feronerie").classList.toggle("rotate");
}
function expansiune_tehnici() {
document.getElementById("dropdown-tehnici-content").classList.toggle("expand");
document.getElementById("arrow-up-tehnici").classList.toggle("rotate");
}