Posts

Adding an Infinite Client Logo Carousel to your Website

Image
Carousel Code below here.. Step-1 :-   Create a  HTML Page . 1-  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html lang=en-US> <head> <title>Adding an Infinite Client Logo Carousel to your Website </title> <script src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> <style type =" text/css "> .slick-slide { margin: 0px 20px; } .slick-slide img { width: 100%; } .slick-slider { position: relative; display: block; box-sizing: border-bo...

Create a password Validation Form

Image
Password Validation Code below here.. Step-1 :-   Create a  HTML Page . 1-  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h3>Password Validation</h3> <p>Try to submit the form.</p> <div class="container">   <form action="#">     <label for="usrname">Username</label>     <input type="text" id="usrname" name="usrname" required>     <label for="psw">Password</label>     <input type="password" id="psw" name="psw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least o...

How to Create a Filter Table

Image
Filter Table Code below here.. Step-1 :-   Create a  HTML Page . 1-  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h2>My Customers</h2> <input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name"> <table id="myTable">   <tr class="header">     <th style="width:60%;">Name</th>     <th style="width:40%;">Country</th>   </tr>   <tr>     <td>Alfreds Futterkiste</td>     <td>Germany</td>   </tr>   <tr>     <td>Ber...

How to Add a Google Map in your Website.

Image
Benefits of Google Maps Street View for Your Business 1- It Builds Trust With Your Customer s 2- It Helps With the Research Process 3- It Creates a Better Connection 4- Better Access to your target Audience 5- It Help Customers Make Informed Decisions 6- Passive Marketing 7- It's a Convenient and Comfortable Experience Some Step Here to generate a Google map. Step 1:- Click On Google Map Google map And Select Your Location:- Step 2:- Click On Menu baar And Now Click On Share or embed map Than Click On  Embed a map Step 3:- Click On Embed a Map                             &               Copy the HTML Code  and paste his website Source code.. Thanks

How to Create a Password visibility in JS.

Image
Password visibility  Code below here.. Step-1 :-   Create a  HTML Page . 1-  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html> <body> <h2>password visibility:</h2> Password: <input type="password" value="123abc" id="myInput"><br><br> <input type="checkbox" onclick="myFunction()"><img src="download.png" width="2%"> <script> function myFunction() {   var x = document.getElementById("myInput");   if (x.type === "password") {     x.type = "text";   } else {     x.type = "password";   } } </script> </body> </html> Thanks

How to Create a Auto Complete Form In Html

Image
Auto Complete Form Code below here.. Step-1 :-   Create a  HTML Page . 1-  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html> <head> <meta name=viewport content="width=device-width, initial-scale=1.0"> <link rel=stylesheet type=text/css href=style.css> </head> <body> <h2>Autocomplete</h2> <p>Start typing:</p> <form autocomplete=off action=/action_page.php> <div class=autocomplete style="width:300px;"> <input id=myInput type=text name=myCountry placeholder=Country required> </div> <input type=submit> </form> <script>function autocomplete(c,a){var f;c.addEventListener("input",function(k){var h,g,j,l=this.value;b();if(!l){return false}f=-1;h=document.createElement("DIV");h.setAttribute("id",this.id+"autocomplete-list");h.setAttribute(...

How to Create a Multi Step form in HTML.

Image
Multi Step Form Code below here.. Step-1 :-   Create a  HTML Page . 1 -  index.html Step-2:-  Write the Code of (Index.html) Page. <!DOCTYPE html> <html> <meta name=viewport content="width=device-width, initial-scale=1.0"> <link href="https://fonts.googleapis.com/css?family=Raleway" rel=stylesheet> <link rel=stylesheet type=text/css href=style.css> <body> <form id=regForm action="#"> <h1>Register:</h1> <div class=tab>Name: <p><input placeholder="First name..." oninput="this.className = ''" name=fname></p> <p><input placeholder="Last name..." oninput="this.className = ''" name=lname></p> </div> <div class=tab>Contact Info: <p><input placeholder=E-mail... oninput="this.className = ''" name=email></p> <p>...