In this tutorial, I am explaining how to add a cover image to a web page like on facebook. Here I am using Laravel framework to create a page where I can upload and adjust the image position like the Facebook cover image. DEMO HTML CSS Jquery PHP HTML Create a div with id=”bgimage”. Inside Read more about How to add a cover image like facebook or adjust the position of image?[…]
In bootstrap there is a component known as modal dialog which is a very useful thing and most often used in a web application with rich user interface to show the user a confirmation dialog (Bootstrap modal) with two choices, for example, if a button click action deletes a record from the database then we Read more about How to create confirmation box using Bootstrap modal[…]
Here I want to explain how you can integrate Google Maps on your webpage and show your location with marker on google map in contact us page. Google Maps is a Web-based service that provides detailed information about geographical regions and sites around the world. In addition to conventional road maps, Google Maps offers satellite Read more about Integrate Google Map in Contact Page[…]
We have done with previewing single image upload before, Now we are going to show you how to select multiple images and preview it before upload. View DEMO Step 1 html markup Here we need to add an extra attribute to our file input tag. The attribute is “multiple” Step 2 Jquery Here we first Read more about Multiple image previews before uploading to server[…]
Here this article explains how to preview an image before uploading on thr server side in jQuery Using HTML 5 FileReader() we can able to preview the image before uploading it in jQuery. View DEMO With jQuery Without jQuery With jQuery Step 1 HTML Markup Lets set up the environment to upload image and preview Read more about Preview image before uploading to server[…]
The fileReader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user’s computer, using File or Blob objects to specify the file or data to read, which means that your program will not stall while a file is being read. File objects may be obtained from a Read more about What is a FileReader?[…]