Tag archives for doctype html

CSS - Cascading Style Sheets

Disable mouse scroll / wheel Zoom on embedded iframe Google Maps

Web Designer / Developer usually embed Google Maps using iFrame in most websites. But, page scrolling stuck when user use mouse scroll in Google map area, and now it is working as Map zoom in/out. So, we always wonder that, "is there a way to disable the zoom via mouse scroll…
Continue Reading
HTML

Disable landscape orientation for mobile users in responsive website

Sometimes, a responsive website looks great on Portrait orientation, but messed up on Landscape. So, a UI Developer wish to disable Landscape orientation for mobile devices (Android & iOS) before getting the website live. Before Viewport meta tag, this is always a challenge to UI Developer to show the website…
Continue Reading
CSS - Cascading Style Sheets

Request Desktop view and disabled zoom viewport meta tag for all mobile browsers

Today, I am going to brief about the working of - "Request a Desktop Site" & "Switch from a Mobile Site" or, Choose “Request Desktop Site” link and let the current webpage reload to the full desktop version of that site. I mean to say that, i am sharing a trick…
Continue Reading
CSS - Cascading Style Sheets

Create a flashing button with CSS3 @keyframes Animation

Often, we need a promotional or highlight button like "Hot Offers/Deals/Promotional Discounts" with flashing effects. Today, we will create a beautiful flashing button without any GIF image using Pure CSS3. Before this, I am going to remind the basic ruls of CSS3 Animation first. CSS3 animations allows animation of most HTML…
Continue Reading
CSS - Cascading Style Sheets

Preview an image / thumbnail before it is uploaded – Html5 FileReader()

It is very easy to preview an image or thumbnail on client side before uploading on the server in jQuery and HTML 5 FileReader() . Suppose you have an application where user uploads bulk photo and then the users want to upload only some selected photo,  in this case, we as a…
Continue Reading
CSS - Cascading Style Sheets

Add style to console log statements

Searching for errors in programming code is called code debugging. Debugging is not easy. But fortunately, all modern browsers have a built-in debugger. Built-in debuggers can be turned on and off, forcing errors to be reported to the user. With a debugger, you can also set breakpoints (places where code execution can…
Continue Reading
CSS - Cascading Style Sheets

CSS3 background gradient animation in a progress bar like in Windows 7

You can create a responsive, animated progress bars like in Windows 7 using pure CSS3. I haven't used any image in this tutorial. Resize your browser window to see the responsiveness. HTML <div class="bar"> <div class="blue loader"> <h3>;/h3> <span class="inner"> </span> </div> </div> CSS Next, we’ll create the background for…
Continue Reading