HTML/CSS

Animation Duration in CSS

Submitted by alpha_luna on
In this tutorial, we are going to learn about animation-duration. So, what is animation-duration? The animation-duration property specifies how many seconds or milliseconds an animation takes to complete one cycle. This property has a syntax: animation-duration: time | initial | inherit ; Property Values time - it specifies the length of time an animation takes to finish. The default value is

CSS @keyframes Rule

Submitted by alpha_luna on
What is a @keyframes in CSS3? The @keyframes rule is used to create animations. In general, an animation in CSS3 is defined as changing from one CSS style to another. Structure: @keyframes name { selector { styles ; } } Property Values: name – it’s specifies the name of the animation. (required) selector – it’s specifies that percentage of the animation duration. (required) Possible Value: 0 – 100

CSS Animation Properties

Submitted by alpha_luna on
What is animation in CSS3? The animation property is a shorthand property that allows to setting six of the animation properties at once. It has a following syntax: animation: name | duration | timing-function | delay | iteration-count | direction | fill-mode | play-state | initial | inherit ; Property Values: name - it’s specifies the name of the keyframe you want to bind to the selector

Simple Analog Clock Using HTML/CSS

Submitted by alpha_luna on
Analog Clock Using HTML/CSS This is a simple analog clock created using HTML and CSS3 only, with no images involved. As such, you can easily customize the size of the clock and its colors etc. The analog clock works in IE9+ and all versions of other browsers, including on mobile. Hope this work will help you in your project. HTML Source Code CSS Style .outer_face { position: relative; width: 200px

How to Create Simple Stopwatch in HTML/CSS with JavaScript

Submitted by alpha_luna on
Simple Stopwatch in HTML/CSS with JavaScript This is an example of a simple stopwatch. It has the ability to keep track on an individual event, especially in a sports event. Try this yourself. This is easy to learn project. It has 3 buttons to operate this stopwatch. These are: Start Stop Pause Hope this simple work will help you in your future project. Enjoy! Source Code Kindly copy the source

How To Use Modal Bootstrap

Submitted by alpha_luna on

Modal Bootstrap

In this tutorial, we are going talk about on Modal Bootstrap. We all know that bootstrap is the front-end designing purpose and this is suit for the mobile for the responsive function. Everyone can learn bootstrap in easy ways even you are a beginner. Today, we talk about the Modal Bootstrap. It is one of the familiar to use in Bootstrap plugin. It contains CSS, jQuery, plugins and other components. We can use to have a sign-up form, confirmation to delete data, and to edit data, etc.

How To Flip The Image

Submitted by alpha_luna on

Good Day!!!

In this tutorial, we are going to learn on How To Flip The Image with jQuery and CSS3. We all know CSS is used to add style to our projects or design to attract the user. And to improve the GUI of the projects. In this case, we use jQuery and CSS3 to flip the image in a horizontal direction.

Login Sign up and Forget Password Form in HTML Bootstrap

Submitted by Deepak86014 on
In this source code we are going to see how to create login , sign up and forget password modal form in HTML using Bootstrap. This modal window allows user to login , sign up and reset password. user can easily move one form to other. This source code can be particular useful if you want to create the login , sign up and forget password forms available to your users in you website. the source code