Posts

Showing posts from October, 2020

Page Speed Script

  <script> document.write("<link rel=\"stylesheet\" href=\"default/css/bootstrap.min.css\" \/>"); document.write("<link rel=\"stylesheet\" href=\"default/css/font-awesome.min.css\" \/>"); document.write("<link rel=\"stylesheet\" href=\"default/css/animate.css\" \/>"); </script> <script> document.write("<script type=\"text/javascript\" src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js\"><\/script>"); </script>

3d Effects

Image
  <!DOCTYPE html> <html> <head> <title> 3d Effects </title> </head> <body> <div class =" container "> <div class =" box "> <div class =" imgBx "> <img src =" img-hover.jpg "> </div> <div class =" contentBx "> <h2> Tilte Box Hover Effects </h2> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum, dolores quo tempore omnis ad similique? Modi, dignissimos molestiae? Enim debitis, deserunt accusantium. Veritatis dicta ipsam illum impedit excepturi suscipit inventore? </p> </div> </div> <div class =" box "> <div class =" imgBx "> <img src =" img-hover.jpg "> </div> <div class =" contentBx "> <h2> Tilte Box Hover Effects </h2> <p> Lorem ipsum dolor sit...

Hover Button Effects

Image
  <!DOCTYPE html> <html> <head> <title> Hover Button Effects </title> </head> <body> <a href =" # "> <span> </span> <span> </span> <span> </span> <span> </span> Buttons </a> </body> </html> <style type =" text/css "> *{ margin: 0px; padding: 0px; box-sizing: border-box; font-family: arial; } body{ display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #1f242d; } a{ position: relative; display: inline-block; padding: 10px 30px; text-decoration: none; text-transform: uppercase; color: rgba(255,255,255, 0.4); background: #262c37; letter-spacing: 2px; font-size: 16px; transition: 0.5s; } a:hover{ color: rgba(255, 255, 255, 1); } a span{ display: block; position: absolute; background: #2894ff; } a span:nth-child(1){ left: 0px; bottom: 0px; width: ...

Animation Line

Image
  <!DOCTYPE html> <html> <head> <title> Scroll HTML </title> </head> <body> <section> <div> <h2> Lorem ipsum dolor, sit, amet consectetur adipisicing elit. Sequi illo autem pariatur sed blanditiis! A libero quisquam, quo esse odit non exercitationem aspernatur, perferendis nisi, ipsam quia voluptate quam, ut eveniet nulla voluptas nesciunt similique quos. Molestiae nulla doloremque perspiciatis nesciunt veniam quos? Veniam itaque, repellendus ex tenetur optio deserunt! </h2> </div> <div> <h2> Lorem ipsum dolor, sit, amet consectetur adipisicing elit. Sequi illo autem pariatur sed blanditiis! A libero quisquam, quo esse odit non exercitationem aspernatur, perferendis nisi, ipsam quia voluptate quam, ut eveniet nulla voluptas nesciunt similique quos. Molestiae nulla doloremque perspiciatis nesciunt veniam quos? Veniam itaque, repellendus ex tenetur optio deserunt! ...