Timeline JS CSS/JS issue, cannot scroll WordPress

Jayaram Y comments:

Hi artaudlemomo,

I have given the same code as well.. Hope that worked.. But the issue with blog post tiltle hiding is, the header is getting fixed at the top, so them main content section is moving to top..

What can be done is.. on mouse scroll, we need to add class to Main content section and give margin-top to it..

artaudlemomo comments:

Thanks Jayaram I saw you helped too,

How to do I do the mouse scroll bit?


Cheers,

Jayaram Y comments:

Hi artaudlemomo,

Please place the code in footer.php file.. just before

<?php wp_footer(); ?>
</body>

This adds a class to the main section.. Let me know once the class is added so that i can give the css to finish this.



<script>
jQuery(function(){
jQuery(window).scroll(function(){
if(jQuery(window).scrollTop()>=100){
jQuery("#main").addClass("main_info");
}
else {
jQuery("#main").removeClass("main_info");
}
});
});
</script>


artaudlemomo comments:

Great I have done it, hopefully properly!

Thanks for you help!

Jayaram Y comments:

to get the blog title below header, you need to add the below script in footer.php and css in custom/style css.


<script>
jQuery(document).ready(function($) {
var scrolltop = 100;
$(window).scroll(function () {
if ($(window).scrollTop() > scrolltop ) {
$('#main').addClass('main_info');
}
else{
$('#main').removeClass('main_info');
}
});
});
</script>


.main_info{ margin-top:180px}
header.shrink{top:0;}


and for header.shrink you need to remove height and max-height.. No need of that.

Hope this helps..

artaudlemomo comments:

Thanks for you help, it worked.

But there is two new issues now, first there is two gray squares on each side of the main menu items, see picture.

The second problem is that my footer is gone completely... I used to have a sentence and some social links button like in the top right corner.

Cheers!