Showing posts with label Various. Show all posts
Showing posts with label Various. Show all posts

Friday, May 26, 2017

Tuesday, March 7, 2017

Display post categories or menu of blogspot site in mobile view

Due to lack of available space, blogspot site's mobile view doesn't provide gadgets like categories, menu etc. But this can be done by making some changes in the HTML. Follow the following steps :

Go to the layout section of dashboard

Click on "Edit" of the gadget. On the addressbar of the browser you'll see something like this - "widgetId=something". For example , here Id = Label2. Remember this Id.

Next, go to the theme section of dashboard. Hit on the setting icon under "Mobile" head. Select a custom theme. Also make sure that you select the first option just like the picture below.


Then click on "Edit HTML" button  in theme section. Find out the id of your desired gadget. Remember, in this example my Id was "Label2". Add an attribute for the gadget - mobile='yes'. Follow the image below.





Hit "Save theme" & you are done. Now you will see the gadget both from mobile & desktop.

 
continue reading Display post categories or menu of blogspot site in mobile view

Thursday, February 26, 2015

Stick Your Website's Div While Scrolling

   This is mainly a blog for android. But Now I am writing here some other things as well. I am using this as my virtual notebook. If you want, you can follow this note.

    If your website has a fixed navigation bar, or sidebar or other div, it looks better. If you can't understand what I am talking about, then you can Visit this (visit from your pc).There you'll see a navigation bar at the top which remains fix while scrolling. To do this we have to follow a little bit javascript code. I am telling the process in step by step.

    Step 1. : First make your html & css code normally.

    Step 2. : We have to use Jquery here. For this, use the following code in the HEAD   tag of html code.

              "<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>"

    Step 3. : Use the following javascript code at the top of the BODY section (<body> ... code ... </body)

              <script type="text/javascript">
                  $(document).ready(function() {
                  var s = $("#sticker");
                  var pos = s.position();                     
                  $(window).scroll(function() {
              var windowpos = $(window).scrollTop();
      
              if (windowpos >= pos.top) {
            s.addClass("stick");
              } else {
            s.removeClass("stick");  
           }
           });
              });
             </script>


             An id "#sticker" & a class "stick" is used here. I am not explaining javascript here.Here the id "#sticker"
             is the id of your desired div which you want to make fix while scrolling.

    Step 4. : Simply add the id "#sticker" to your desired div

    Step 5. : Add the following code in your css file

              .stick {
                  position:fixed;
                  top:0px;
                     }


That's all! Now save the files and see.

Note: The link I have used above is my practice site.Lots of lacking there. Visit the site from your desktop or 
laptop. Otherwise you will unexpected result. You may see a error like this "This site may be fake!".
  








continue reading Stick Your Website's Div While Scrolling