create "stay on top menu" using jquery(floating menu).

1)    Add the below Jquery in JS file,

$(function(){
   
    var menu = $('#menu'),
        pos = menu.offset();
       
        $(window).scroll(function(){
            if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){
                menu.fadeOut('fast', function(){
                    $(this).removeClass('default').addClass('fixed').fadeIn('fast');
                });
            } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){
                menu.fadeOut('fast', function(){
                    $(this).removeClass('fixed').addClass('default').fadeIn('fast');
                });
            }
        });

});

Here,
#menu  Outer dive of the menu.
2)    Add the below CSS 
.fixed {
        position: fixed;
        top: -5px;
        left: 0;
        width: 100%;
}

Note:  Need to add the jquery/1.4.2/jquery.min.js (i.e version >= 1.4.2)

Comments

Post a Comment

Popular posts from this blog

PHP - How to increase size of POST value in php

Problem: PHP/HTML Forms with more the >20 fields(which approx post more the 1000 characters) will end up in error or the posted values will not be received in form action because by default in php  max_input_vars is set to 1000 . Solution:   In this case you can increase the size of  max_input_nesting_level and  max_input_vars in php.ini to resolve. max_input_nesting_level: Sets the max nesting depth of input variables (i.e. $_GET, $_POST.) max_input_vars How many input variables may be accepted (limit is applied to $_GET, $_POST and $_COOKIE superglobal separately). Use of this directive mitigates the possibility of denial of service attacks which use hash collisions. If there are more input variables than specified by this directive, an E_WARNING is issued, and further input variables are truncated from the request.
Read more

D8 KernelEvents constants

Here is a list of KernelEvents constants: KernelEvents::CONTROLLER ; // The CONTROLLER event occurs once a controller was found for handling a request. KernelEvents::EXCEPTION ; // The EXCEPTION event occurs when an uncaught exception appears. KernelEvents::FINISH_REQUEST ; //The FINISH_REQUEST event occurs when a response was generated for a request. KernelEvents::REQUEST ; // The REQUEST event occurs at the very beginning of request dispatching. KernelEvents::RESPONSE ; // The RESPONSE event occurs once a response was created for replying to a request. KernelEvents::TERMINATE ; // The TERMINATE event occurs once a response was sent. KernelEvents::VIEW ; // The VIEW event occurs when the return value of a controller is not a Response instance.
Read more

D8 - Attach file programmatically to a node

Scenario 1: If the file resides on the other server/website. Try the below code, use \Drupal\node\Entity\Node; /** Create file object from remote server/website URL. */ $data = file_get_contents('https://www.example.com/sites/default/files/logo.png'); $file = file_save_data($data, 'public://logo.png', FILE_EXISTS_REPLACE); // Create node object with attached file. $node = Node::create([   'type'        => 'article',   'title'       => 'Sample test',   'field_image' => [     'target_id' => $file->id(),   ], ]); $node->save(); Refer " file_save_data " API for more options/overide functions Scenario 2:  If the file resides on the same server/website. Try the below code, use \Drupal\node\Entity\Node; use \Drupal\file\Entity\File; // Create file object from a locally copied file. $uri  = file_unmanaged_copy('public://source.jpg', 'public://destination.jpg', ...
Read more