Skip to main content

How to shrink navbar on scroll ?

Shrink navbar on scroll 



<style>
.nav_logo_scroll{

width: 120px !important;
    transition: all 0.5s linear;
margin-left: 45px
}
.jassi{

width: 100% !important;
  transition: all 0.5s linear;
}
</style>


<script>
jQuery(document).ready(function($){


$(window).scroll(function() {
if($(document).scrollTop() >=1) {
$('.nav').css('position','fixed');
$('.nav_logo').addClass('nav_logo_scroll');
$('.nav_logo').css(' transition','all 0.5s linear');
$('.nav_logo').removeClass('jassi');
}
else if($(document).scrollTop() < 250) {
{ 
$('.nav').css('position','relative');
$('.nav').css(' transition','all 0.5s linear');
$('.nav_logo').removeClass('nav_logo_scroll');
$('.nav_logo').addClass('jassi');
}
}
});

});


</script>

Comments

Post a Comment

Popular posts from this blog

How to use inner html value or data in php from javascript(innerHTML)?

 use inner html value or data in php from javascript(innerHTML)? <html> <body> <p id="demo">use inner html value in php(innerhtml)</p> <script>   var jassi = document.getElementById("demo").innerHTML;   //document.write(jassi); </script> <?php $jassi = '<script>document.write(jassi);</script>'; echo $jassi; ?> </body> </html>
Post a Comment
Read more

How to build a tree from a flat array in PHP>

Build a tree from a flat array in PHP   $hello = array   (   array("ID" => "1","student" => "Jassi","marks" => "80","parent_id" => ""),   array("ID" => "2","student" => "Golu","marks" => "80","parent_id" => "1"),   array("ID" => "3","student" => "Jassi","marks" => "80","parent_id" => "1"),   array("ID" => "4","student" => "Jai","marks" => "90","parent_id" => "1"),   array("ID" => "5","student" => "Jassi","marks" => "85","parent_id" => "1"),   array("ID" => "6","student" => "Ravinder","
Post a Comment
Read more

How to create remove and add more inputs functionality with input type file and text in Laravel?

Create remove and add more inputs functionality with input type file and text in Laravel Blade file code       <form action="{{ route('storeDocuments') }}" method="post" enctype="multipart/form-data">         @csrf         <div id="inputFields">             @if(!empty($documents[0]))             @php $counter = 1000; @endphp                 @foreach($documents as $document)                     <input type="hidden" id="document_id" name="documents[{{$counter}}][document_id]" value="{{$document->id}}">                     <div class="field">                         <label for="title">Title:</label>                         <input type="text" id="title" class="title_input" name="documents[{{$counter}}][title]" value="{{$document->title}}" required>                         <label for=&
Post a Comment
Read more