Skip to main content

Posts

Showing posts from June, 2017

Reusable Image Validation (Client Side) Using jQuery

We will handle Image Validation using two ways, client side and server side. I have explained client side Image validation here. But you can also handle the server side Image Validation as you want. Client Side Image Validation Using jQuery and Bootstrap Here is the Form <input> field to upload  an Image file. I added "accept" attribute in the Input tag which indicates the types of file the server accepts. (read more: https://developer.mozilla.org/en/docs/Web/HTML/Element/input) Here is the Reusable Image validation Script. In this Script it allows only JPEG, JPG and PNG files but you can add more file extensions as you want. Note: Do not put this Script within (document).ready(function(){}) otherwise may be it will not work.    Requirements: jQuery Bootstrap

Bootstrap Responsive Media Queries CSS Tips

AS a developer I faces lots of problem while making website responsive to make website visible correctly on all devices like mobile, tablet and desktop. So, today I am sharing some Bootstrap responsive CSS styles and Media Queries  tips with you. But make sure that you are not repeating the same media queries for the same screen size. Otherwise it will override your previous CSS style rules.    The Grid Sizes .col-xs-$ => Extra Small (Phones Less than 768px) .col-sm-$ => Small Devices (Tablets 768px and Up) .col-md-$ => Medium Devices (Desktops 992px and Up) .col-lg-$  => Large Devices (Large Desktops 1200px and Up) Here is the Responsive CSS Style for all Screen Sizes Read more: https://scotch.io/tutorials/default-sizes-for-twitter-bootstraps-media-queries