当用户向下滚动页面时显示隐藏的div

时间：2015-10-11 15:38:00

标签： javascript jquery html css twitter-bootstrap

＆lt; p＆gt;当您滚过它时，我有一个导航栏粘在页面顶部。 当此导航栏固定在页面顶部时，我希望显示一个徽标。 徽标位于div＃navlogo内。＆lt; / p＆gt; ＆lt; p＆gt;我目前将#navlogo设置为display：none。我想当你滚动超过100px时，它的显示需要设置为显示块或类似的东西。＆lt; / p＆gt; ＆lt; p＆gt;我尝试过一些东西，但我不擅长java并且没有运气。＆lt; / p＆gt; ＆lt; p＆gt;＆lt; a href =＆＃34; https://jsfiddle.net/gx25ospo/2/" rel =＆＃34; nofollow＆＃34;＆gt;您可以在这里查看JSFIDDLE＆lt; / a＆gt;＆lt; / p＆gt; ＆lt; p＆gt;这是我用来将导航栏设置为固定＆lt; / p＆gt;的脚本 ＆lt; pre＆gt;＆lt; code＆gt; $（window）.scroll（function（）{     var nav = $（＆＃39; #custom-bootstrap-menu＆＃39;）;     var body = $（＆＃39; body＆＃39;）;     var top = 100;     if（$（window）.scrollTop（）＆gt; = top）{         nav.addClass（＆＃39; Navbar的固​​定顶＆＃39）;         body.addClass（＆＃39;填充-50＆＃39）;     } else {         nav.removeClass（＆＃39; Navbar的固​​定顶＆＃39）;         body.removeClass（＆＃39;填充-50＆＃39）;     } }）; ＆LT; /代码＆GT;＆LT; /预＆GT; ＆lt; p＆gt;和一点点css＆lt; / p＆gt; ＆lt; pre＆gt;＆lt; code＆gt; #logo {     身高：100px; } .padding-fifty {   padding-top：50px; } #navlogo {     display：none; } ＆LT; /代码＆GT;＆LT; /预＆GT; ＆lt; p＆gt;如您所见，它将导航设置为固定，并通过添加50px来补偿页面偏移。我需要一些将#navlogo设置为可见的东西。任何人都可以提供一些帮助吗？＆lt; / p＆gt; ＆lt; p＆gt;非常感谢您的帮助！＆lt; / p＆gt;

3 个答案:

答案 0 :(得分：0)

您可以在Javascript中设置css display属性：

var logo = $('div#navlogo');
logo.css('display', 'block');

例如：https://jsfiddle.net/gx25ospo/3/

答案 1 :(得分：0)

最后尝试将此样式添加到CSS中：

.navbar-fixed-top #navlogo {
    display:block;
}

答案 2 :(得分：0)

试试这个https://jsfiddle.net/gx25ospo/4/ 

PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534443): failed to open stream: HTTP request failed! HTTP/1.0 404 Not Found
 in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534445): failed to open stream: HTTP request failed! HTTP/1.0 404 Not Found
 in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534447): failed to open stream: HTTP request failed! HTTP/1.0 404 Not Found
 in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534449): failed to open stream: HTTP request failed! HTTP/1.0 404 Not Found
 in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534451): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534454): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534456): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534458): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534460): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534462): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534464): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534466): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534468): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534470): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534500): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60
PHP Warning:  file_get_contents(http://www.oref.org.il/WarningMessages/Alert/alerts.json?v=1444534502): failed to open stream: Redirection limit reached, aborting in /home/dupdates/domains/dupdates.com/public_html/systems/history/script.php on line 60

JS 

.navbar-brand {
display: none;
}

.visible {
display: block;
}
相关问题
最新问题