Skip to main content

Posts

GLASS EFFECTS HOVER BUTTONS

GLASS EFFECT HOVER BUTTONS  Hey Folks ✋! Today I'am going to show you how you can build " Beautiful Glass Effect Hover Button " But first of all you must know what is " Hover-Effect ". HOVER: Applies to any element being hovered by the user's pointing device, but not activated. There are three pseudo-classes that allow you to change the appearance of elements when a user is interacting with them. HOVER ACTIVE FOCUS but we focus only hover today and clear our concept 😃😊. WHEN WE APPLIED HOVER ? This is applied when a user hovers over an element with a pointing device such as a mouse.  This has commonly been used to change the appearance of links and buttons when a user  places their cursor over them. It is worth noting that such events do not work on devices that use touch screens (such as the iPad) because the screen is not able to tell when someone is hovering their finger over an element. EXAMPLE OUTPUT SOURCE CODE HTML: <!DOCTYPE   html > <htm
Post a Comment
Read more
Recent posts

Netflix Logo with CSS

  Netflix Logo With CSS Hello Folks! today I'am going to share with you a "Netflix" logo design with CSS code is easy and simple even 10y/o child could try.   Let's see our Source Code : If you know Html and CSS very well then this post is just a piece of cake with you not and hard and fast coding is applied just span tag i choose and design it accordingly. Index.html  <div class=" container ">     <span></span>     <span></span>     <span></span>   </div>  Style.CSS   body { background:#26242e; } .container{   position:absolute;   top:30%;   left:50%;   display:flex;   width:120px;   height:200px;   overflow:hidden; } span {   position:absolute;   width:40px;   height:200px;   background:#d81f26 } span :nth-child(1){   right:0; } span :nth-child(2){   left:40px;   z-index:1;   transform:skew(22deg);   box-shadow:0 0 15px #000; }  Explanation of Code : .Container: In ".container" we just center our &
1 comment
Read more

Login & Signup forms using Html & CSS

  Login /Signup Form  Using Html & CSS Hello hope you all are fine :-), today I'm going to make Login and signup form by using html & css it is very easy to create just like a piece of cake! Login Form Index.Html <!DOCTYPE   html > <html   lang = "en" >      <head>      <meta   charset = "UTF-8" >      <meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >      <title> Join-Us </title>          <link   rel = "stylesheet"   href = "join-us.css" >     </head> <body>    <div   class = "form" >      <h1> Login  <span><hr   style = "  border: 0;       height: 1px;              background: rgb(129, 133, 131);padding-top:2px;       background-image: linear-gradient(to right, rgba(122, 184, 93, 0.678), rgba(135, 172, 141, 0.404), rgba(202, 200, 200, 0.521)); " ></span></h1>          
Post a Comment
Read more

Best ToDo-Application using javascript

To Do Application  What is To Do List? ToDoList is a type of software which is used for managing your productive workflow.It is also called "Getting things done" (GTD), scheduling and collaboration. ToDoList is general-purpose, Windows-based software, which can be used for simple “honey do” home lists or to manage complex multi-user projects for business. In addition to tracking the status of tasks, ToDoList includes a powerful system for logging and reporting time spent on tasks. Combined with powerful reporting mechanisms, this makes ToDoList an effective tool for client billing. About My To Do Application So as you can read the above intro of ToDO-Application, I build this with very easy way and you can also try this for enhance or revise your JavaScript concepts. The code is simple and easy to understand, if you are new to JavaScript and web development then this tutorial is for you.I tried my best to design it for user friendly and keep it simple.Here is some screen sh
Post a Comment
Read more