javascript - inputs show in my fixed header -
i have in body page, want fixed header when scroll in page... seek more options show inputs in fixed header, prove z-index can't move sliders after
this 1 example...
i want fixed bar canvas , background , when scroll on page, bar fixed @ top...
...
html :
<body style=" background-color:black;"> <section id="headerhtml"> <canvas id="mycanvas" width="300" height="300" style="border:1px solid #d3d3d3;"></canvas> </section> <section id="bodyhtml" > ..... </selection> </body> jquery:
$(document).ready(function() { var div = $('#headerhtml'); var start = $(div).offset().top; $.event.add(window, "scroll", function() { var p = $(window).scrolltop(); $(div).css('position',((p)>start) ? 'fixed' : 'static'); $(div).css('top',((p)>start) ? '10px' : ''); }); }); and css:
#headerhtml{ background-image:url('fondo_nou.jpg'); background-repeat: no-repeat; width: 100%; height: 100%; padding:5px 20px; } thanks !!
sorry english... used google translate :)
i used bootstrap navbar solve problem, code is:
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <section id="headerhtml" style="background-color: black"> <canvas id="mycanvas" width="300" height="300" style="border:1px solid #d3d3d3;"></canvas> </section> </nav> javascript jquery html css canvas
No comments:
Post a Comment