Featured
-
How Regression Testing Detects Integral Errors In Business Processes
Humans are forever changing and evolving and so to
by kristina.rigina -
Get Display Banner Advertising Opportunity on FindNerd Platform
“Do you have a product or service that nee
by manoj.rawat -
Android O Released with Top 7 New Features for App Developers
Android was founded by Andy Rubin, Rich Miner, Nic
by sudhanshu.tripathi -
Top 5 Features That Make Laravel the Best PHP Framework for Development
Laravel is a free open source Web Framework of PHP
by abhishek.tiwari.458 -
Objective C or Swift - Which Technology to Learn for iOS Development?
Swift programming language is completely based on
by siddharth.sindhi
Tags
Apply this popup feature for infinite users
I made a popup feature, which shows the phone number of a user. I was able to apply this feature to one instance. A single user.
Normally, each user has a unique phone number.
But then, I thought, what if I have lots of users as they come, ...
moving between section page using next and previous button in javascript
In the same page i have multiple section.
One section will be show and this will happen using a class active.
In the same page i have li buttons 1, 2 and 3 when i click on one of them the section related appear and the old one disappea...
How do I adjust the top position of a div with a dynamically fixed position?
I have a page with a fixed top bar and a section menu that fixes to the bottom of the viewport on small devices and at the top, below the top bar, on devices with viewports wider than 1080px.
There's also an element at a certain point down...
How to Create Server for Multi-user Quiz using HTML, CSS, & JavaScript?
I am designing one quiz for my team members using HTML, CSS, and JavaScript but don't know how to make it available to multiple users at the same time. I want to build a real-time quiz as we have in any online entrance exam.
I kn...
Coding Guide to HTML and CSS: Do You Need Software to Write It?
Have you thought about learning more about web development? No matter what occupation you are in, it can help to know about CSS and HTML. These are the two most common coding options for creating web pages. In fact, many people utilize both CSS a...
Why You Should Stop Using CSS in JavaScript for Web Development
In these times, CSS has lost a lot of popularity. The community believes that CSS is an obsolete and unnecessary tool, and that is why they are increasingly betting on JavaScript and its frameworks. And that is a mistake. In this article I hope t...
How to Create a Simple Admin Page in HTML?
At first i'm a beginner and i have a simple project to do.
I'm trying to build a simple admin page that add some content to my website
This is not a big deal, but i need someone who can instruct my directly ...
How do I Fix the Layout for My Html Website?
I recently did some coding for a school project and needed some help with the layout.
Here are my questions:
What do I do on my css to change how the text "NRL 15/07/18 looks?
How do I move the text saying "Wo...
Why My Quiz Web App Not Displaying Result on Submit?
Every time I click the button to submit my answers the page refreshes and no grade is shown and I don't know why.
Any help would be greatly appreciated.
My code is below:
<!DOCTYPE html>
<html>
<h...
Form Validation Using Angular Validator in Ionic Framework - Basic Tutorial
The client side form validation is offered the AngularJS. The state of the form and input fields are monitored by AngularJS which helps us to notify the user about the current state along with, it also keeps the information if they have been chan...
How to do styling of a page header layout to fit in tablet & smart phones?
I have this page header and i need to make responsive so it can fit in tablet and smart phones and i need to direct form right to left and how can i use pure javascript to achive that (no Jquery needed)
<!DOCTYPE html>
...
How to Implement AngulaJs Form Validation in a Web Application
AngularJS is an open source free and most popular JavaScript client-side framework which provides a great power to built HTML and JavaScript based web application.
This tutorial is in continuation with my previous tutorials, regardin...
Use Position Property-Sticky to Make an Element Stick at Any Portion of the Window
In CSS, we have learned many things and there is a very unique concept of one of the property i.e position and its values i.e static, fixed, absolute, relative.
We all have gone through these properties but not the new value in the p...
Top 8 Major Changes in Latest Bootstrap 4 Alpha Version for Web Designers
Hello Readers! Currently alpha version of Bootstrap 4 has been released on 19 August 2015 with some major changes. Moving from bootstrap 3 to bootstrap 4 , some components are changed and some are improved and only few have been dropped.
...
Materialize UI
A modern responsive UI component library made with CSS, JavaScript, and HTML is known as Materialize UI. This reusable UI component helps in developing attractive, predictable, and functional site pages and web applications while clinging t...
What is SASS ?
SASS (Syntactically Awesome Stylesheet) is a CSS pre-processor which helps to reduce repetition with CSS and saves time. It is more steady and intense CSS extension language that depicts style of document neatly and fundamentally.
Reason ...
Difference between Bootstrap 3 & Bootstrap 4
As we know, Currently, Bootstrap 4 alpha was released. So, In today blog, I am going to tell you major changes and differences between Bootstrap 3 & Bootstrap 4. Here are the following differences:-
S No.
Bootst...
Introduction to bootstrap 4
In this blog, I'll tell you a brief description of Bootstrap 4. Currently, Bootstrap 4 alpha was released. This release included a major upgrade of Bootstrap with some huge changes to the way it functions. Porting from Bootstrap 3 to Bootstra...
Bootstrap Images
In this blog, I'll tell you how to style images whether its image with rounded corners, image with circular shape, image with thumbnail shape.
Rounded Corners :-
The class .img-rounded is used to add&nbs...
What are some of the best hybrid apps and what level of programming experience is needed to build one?
I've heard that a hybrid app is built with a combination of web technologies like CSS, HTML and JavaScript and it can easily access hardware capabilities of the mobile device.
Please enlighten me with some examples of the best hybrid apps ...
Scroll Fixed Header in jQuery
In this article, you will learn how to fix the header all the time while scrolling your website page. There are different jQuery plugin available for this purpose but we will use a simple jQuery based solution to make a header fixed on the top of...
Learn how to create a slide using pure CSS
Hii,
In this blog, I am going to share an example in which i have created a pure CSS Slider using few CSS properties like transitions, transforms,input:checked functionality and animations.
Slider is the most ...
Bootstrap Grid System
A grid is an arrangement which is separated into div sections. This is an extremely helpful strategy to oversee HTML format and clients can make easily. To make organised grids and organized content , Bootstrap introduces responsive grid system w...
Image Overlay Hover Effects With CSS3 Transitions
In this blog i am explaining how to create a overlay effect in image with the help of css3 . Overlay effect on image is an awesome approach to include some decent interactivity to your website.
In image overlay effect when we take our cu...
Creating Superscript and Subscript Text in CSS
If you want to make your text superscript text(raises the text) or subscript text(lowers the text), css3 property can be used.
CSS3 provides vertical-align property which can be used to make superscript or subscript effects in your HTML text of ...
Displaying div on radio check using jQuery
Hiding/Showing div on checking radio:
We can easily hide or display a div by checking the radiobox options using jQuery. We can do this by checking radio options attribute and according to attribute we can hide or show a div.
Example:
...
What is SVG and How Can We Embedding SVG in Html5?
Scalable Vector Graphics is mostly known as SVG is an image format type which is based on XML it is basically used for 2-dimensional graphics for a web. We can resize SVG vector images to any extent without destroying the image qualit...
Simple Digital Clock using JavaScript
In this blog, we will learn about how to create a simply animated digital clock with javascript. As we know, browser executes any javascript program at the client side, this means that the script will take the time of the client computer and will...
Animated Check Boxes Using CSS3
In this article, you can see how to create custom animated check boxes using css3.
Suppose you have some input type checkbox. Now you can add a label after checkbox and animate it with css3. Here is an example that shows the animated check box...
Navigation Elements - Bootstrap
In Bootstrap, there are many options with the help of which we can style navigation elements and these all share the same markup and base class .nav .
Following are those different options :-
Tabular Navigation or ...
Full Calendar Events From Database
1- Create a mysql Database.
2- Create a Table events inside created database.
CREATE TABLE `events` (
`id` int(10) NOT NULL AUTO_INCREMENT,
...
Full Calendar Implementation
1- Place the JS files in js directory.
fullcalendar.min.js
jquery.min.js
moment.min.js
2- Place CSS files in CSS folder.
fullcalendar.css
fullcalendar.print.css
3- Paste the bellow javascript code i...
Chapter 2 : CSS Color
CSS color values is used to set the two type background color, foreground (borde-color,text-color etc.) to define a color value we some color format. You can determine your color values in different formats. Below is lists all of possible formats...
Chapter 1 : CSS Introduction
Cascading Style Sheets, affectionately alluded to as CSS, is a straightforward plan dialect proposed to streamline the way toward making pages satisfactory.
CSS handles the look and feel part of a site. Utilizing CSS, you can control the shade...
Jcrop image croping
1- Place JS and CSS files under head tag.
jquery.min.js
jquery.Jcrop.js
main.css
demos.css
jquery.Jcrop.css
2- Also copy and paste bellow piece of javascript code under head tag.
<script type="text/javascript"...
jQuery clone method with Id change
Here in this blog I am going to explain about the JQuery CLONE WITH CHANGING ID, for doing this we have to know about the clone() method so this method used for performing a deep copy of the set identical elements, it is useful for moving copies ...
Bouncing Ball Animation
Hello, Readers!
Here in this blog, we can see the power of css3, by using only CSS. This bouncing ball will give the effects of bounce and touches its shadow, this will be possible by using Keyframe and animation. We have here three main d...
An Overview To Counter-Reset Property In CSS
Hello readers, Today in my blog I will discuss about Counter-reset property used in CSS.
Introduction :-
The Counter-Reset property basically uses both the counter-increment and content properties of CSS.
The counter-increment ...
Stylish tooltip using Pure css
Tooltip is used for the indicating the lable or representing the message to the user, or it is consider as a hint to the element having the cursor pointer property. The user points the item, without clicking to it then the tooltip will...
How to Customize Checkbox With the Help of CSS?
s we know checkboxes look and feel is dependent on the operating system in which we are seeing them .For windows operating system they look different and for mac operating system they look different. It is very difficult to change the look of the...
An Overview on SVG Images
Hello readers, Today in my blog I will discuss Scaleable Vector Graphics Images.
Introduction:-
It is an XML-based vector images created for 2D graphics.
Using the Vector Graphics we can create geometric objects such as lines...
Hop Over Notification Badge
Hello Readers!
We web designer can give new look and feel to any content of the div, We have numerous style, effects and animation including keframes which will result to get a graceful ambience to the content, Here in this blog i used same effe...
How to eliminate render-blocking JavaScript and CSS in above-the-fold content
Hello Nerds,
While creating a project, i found that the pages are rendering very slow. After testing and searching i found that my pages have some blocking CSS resources which are causing delay in rendering my pages. Please help me how to elim...
Dropdown with Multiple checkbox select with jQuery
jQuery multiselect list with checkbox is used for making selection among the choices that user want to select. There are various pulgin used for converting simple dropdown list to multiple select dropdown with checkbox. It cant includes checkbox ...
CSS Box Sizing
The property which is used to calculate the height & width of an element is known as box-sizing.
Syntax :-
box-sizing: content-box|border-box|initial|inherit;
1. content-box :- It is the default property where, bor...
Tabbed Content Area with CSS and jQuery
In this blog I build tabbed contents using CSS and jQuery, Tabbed content is a beautiful way of displaying the content in the precise and concise manner. This structure could be possible using the unordered list that act as a tabbed in a row and ...
An Overview to Map Tag in Html
Hello readers, Today in my blog I will discuss about Map tag which is less used but have various features.
As there are around 142 HTML elements that has been standardized by W3C. Below is the brief description about Map Tag in HTML ...
Parallax scrolling to content using CSS
Scrolling effects will be easy now by using the parallax site, that will able to scroll the two section smoothly between the two content div. Here I used three div for setting the different images in the background. While the caption heading for ...
How to create Simple Phone Number Picker
Hello readers, Toady in my blog i have tried to create a simple phone number picker using CSS and JavaScript.
While filling many online forms besides names and emails, contact information filed is also essential part to be filled by ...
Difference b/w Div and Span Tags
Hello readers, Toady in my blog I will discuss upon the difference b/w Div and Span tag in HTML.
For every beginner it is very confusing where to use which tag either Div or Span.
The <span> and <div> tags ar...
