HTML/CSS

Modern Portfolio Page Design (3D Nav...)

Submitted by abfiph on
SASS and CSS We use SASS and Bourbon (http://bourbon.io/) for our resources. If you don't use SASS, just use the .css files that you find in the css folder. You can delete both sass and partials folders. For more details. Pls Like & Share www.facebook.com/DavaoWebDev Join Community www.facebook.com/groups/FutureDeveloper

Animated screen from CSS3 "Hypnotize you!"

Submitted by abfiph on
In this article, I would like to share with you a simple source code that can Hypnotize you while you are watching on your computer screen. You can request code at hi https://m www.facebook.com/saaduddinj more messing with SCSS for loop Like my page & join group for further free sourcecode secrets https://www.facebook.com/DavaoWebDev IT Group Members https://www.facebook.com/groups/FutureDeveloper

How To Create Simple Color Picker

Submitted by alpha_luna on
A color picker is a color tool or it’s a color application that usually found on the internet, which the users allows choosing the color that he/she want. In this tutorial, we are going to learn about on How To Create Simple Color Picker. In this example, we’re using CSS style to display the color board. By clicking the respective color in the board we are using jQuery CSS function to pick and apply the colors to the empty space.

HTML

This is HTML code for displaying color board to pick your color that you want.

CSS Geometric Shapes

Submitted by alpha_luna on
We all know that CSS stands for (Cascading Style Sheets). It can manage the layout of your multifarious web pages at once… And it saves a lot of jobs. In this tutorial, we are going to learn about on CSS Geometric Shapes. We can make it without using images. Most of them are draw using CSS. This is for the beginners.

Real Estate Website using AngularJS

Submitted by jaronavales on
Getting Started with AngularJS AngularJS is an awesome framework for building single page web applications, and it's definitely among the most popular out there. When I started learning Angular, I felt lost for quite a while, and I couldn't quite wrap my head around it at first. This app you can see the real estate website and it's property listing page. Through this, you can Edit, Delete and Add

How to Create a Ribbon using CSS

Submitted by Jeprox on
In this tutorial we are going to learn how to make ribbon using CSS. You may play around with the CSS codes change the positions of the ribbon elements . Here's the code: CSS Code: .ribbon { font-size: 16px !important; width: 300px; position: relative; background: #C50F0F; color: #fff; text-align: center; padding: 1em 2em; margin: 2em auto 3em; } .ribbon:before, .ribbon:after { content: ""

Swinging Image using CSS3 Animation

Submitted by Jeprox on
In this tutorial we are going to learn how to make an image swing continously using CSS3 keyframe animation. This effect has become popular for images like signs and discounts in websites for this they get the attention of the users or visitors. You can play around with the codes try to change the values and see the changes. Here's the complete source code: Swinging Image CSS3 Animation Swinging

Creating Shapes Using CSS3

Submitted by jaredgwapo on
In this tutorial, I am going to teach you how to make shapes like pentagon, stars, circles and etc using CSS3. Just download the source and follow the directions below. DIRECTIONS DON'T FORGET TO INCLUDE THIS LINK INSIDE THE HEAD TAG CSS CODE (Save it as style.css) Code for Pentagon .pentagon { margin: 30px 0 0 0; /* cosmetic */ position: relative; width: 54px; border-width: 50px 18px 0; border

3D Portfolio Panel Page & Touch Screen Effects

Submitted by abfiph on
SASS and CSS We use SASS and Bourbon (http://bourbon.io/) for our resources. If you don't use SASS, just use the .css files that you find in the css folder. You can delete both sass and partials folders. Instructions: Just run on your normal desktop browsers & mobile browsers tool. Thanks & Enjoy. Hope you like it. I am happy if like my codes