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
how to bind click event on dynamically created elements
Below is the example for how to bind click event on dynamically created elements.
If you having trouble with such issues, then use the below code.
Here is the HTML
<a href="#" class="button">Button</a>
<div class="lis...
AngularJS Controllers
AngularJS applications are controlled by controllers. A controller is a JavaScript Object, which is created by a standard JavaScript object called constructor. In below example lastName and firstName are two properties of controller object demons...
How to centralize div horizontally and vertically ?
Hi all,
Here are two method to center align a position of div.
div{
height: 200px;
width: 200px;
background: #ccc;
top:0;
bottom: 0;
left:0;
right: 0;
margin: auto;
position: absolute;
}
In...
Rollover with a Mouse Event
With the help of JavaScript and html we create a "Rollover with a mouse event" function. Here we have two images. when we place mouse over image(1), the image(1) changes to image (2) and when we move the mouse away from that image, the original i...
How to make Inside border transparent ?
Hi all,
Here are two method to make transparent border first is by using pseudo element and second is by using background-clip
Example 1:-
In the method I'm using pseudo element :before
.box-border {
background: #0f8ac3;
c...
How to change placeholder color ?
Hi all,
Many time we need to change the input placeholder color or style so here is an pseudo element ::placeholder which can helps you. placeholder defult color is gray with 0.6 opacity so if your input background color is dark in gary, you...
Google Map integration in PHP to Calculate Latitude and Longitude
This code will calculate the latitude and longitude of the place in background on entering the place name.
For integration of Google map to calculate Latitude and Longitude major script is :
<script src="https://maps.googleapis.com/maps/...
How to append/add set of input field in a form with just once click?
I designed my form with writing this script below. In this script showing $(wrapper).append() will trigger the action of adding the input boxes or any thing that you put inside it. For ex I used name, email and phone input text boxes. All you ju...
How to remove a HTML element using Jquery
Hello reader's,
Below is the example to Remove the HTML element using Jquery
If you having trouble with such issues, then use the below code.
Here is the HTML
<p>Write your text here.</p>
<p>Write your text here.<...
How to Get height width or element using Jquery
Hello reader's,
Below is the example for Getting height width or element using Jquery
If you having trouble with such issues, then use the below code to resolve such issues.
Here is the HTML
<button id="dummy-height">Get div Heigh...
How to Create Cross-Browser Custom Upload Button with Jquery
Hello Reader's
In this article I will guide you to create Cross-Browser Custom Upload Button With JQuery
If you facing any problem for upload button use this code.
Here is the HTML
<div class="Container">
<label>Upl...
Simple Parallax Effect with smooth scrolling Jquery
Hello reader's,
Below is the example for Simple Parallax Effect with smooth scrolling Jquery
If you having trouble with such issues, the use the below code.
Here is the HTML of Scroll trigger
<div class="carousel-indicators">
...
Add or Remove Class by Using Jquery
Hello Guys
The below example will guide you to add or remove class by using jquery.
So if you are stuck in such case follow the below code.
Here is the HTML Code
<nav>
<ul>
<li><a href="javascript:v...
How to show any video from Youtube to your website customized
Hi,
You want to show any video from youtube to be shown in you website, read my following steps
There are several other customization features that you can do with video ,i.e.(set Height or width, set youtube logo, Show suggested videos when t...
custom checkbox and radio button using pure css
Hi all,
Here is an example of custom radio button and check box using pure css.
I hope it will helps you.
CSS :-
**/*Radio button*/
.radio, .checkbox{display: inline-block;}
.radio { padding:5px; margin-left:40px; }
.radio input[ty...
How to Integrate Skype with Webpage ?
Hello Readers,
Here I am mentioning steps to integrate Skype with a webpage.
Hope it will help you somewhere.
To generate code for Skype buttons, use URL
http://www.skype.com/en/features/skype-buttons/create-skype-buttons/
You will get t...
403 Error Unable to load the HTML Page
Hi,
I have a issue in trying to access a page on my website
When I try to open the html page it gives me an error 403
"You do not have permission to access/main/menu.html on this server."
I have also changed the permission of the folder....
Fonts sizes
Hello Readers
In this article I will guide you about the font size diffidence pixels, points, ems & %.
Here is a flow chart below in which I have mention the difference between pixels, points, ems & %. these font sizes are not actual.
...
Create Horizontal Accordion Using CSS3 and HTML
It is a simple horizontal accordion built in CSS3 and HTML. Copy CSS3 code and paste it between style tag.
CSS
body, button, input, select, textarea { font-family: sans-serif;}
/*Define Accordion box*/
.accordion { width:830px; overflow...
How to get selected drop box text
Normally when we select a value from drop bax then we get the value of option. Here when we will select a value of option then we will getting text of option.
SO to get selected drop box text use below code example-
Javascript
function get...
How to included a timer on a web page
hello all,
I want to include a timer on a web page which is designed for taking online test like on this website whose link is as followed http://www.indiabix.com/online-test/aptitude-test/random.
Please suggest me how can I do that .
Load html file from assets folder in a WebView
By doing following steps you can load the HTML file from the assets folder inside your application:-
1) Copy that HTML file inside your assets folder.
2) Define a WebView in your layout, like this
<WebView
android:id="@+id/webvi...
Bootstrap versus Foundation
*{margin:0;padding: 0;}
.mdUP table{border-collapse: collapse;width: 100%;margin:10px 0;}
.mdUP table thead{background: #ccc;}
.mdUP table th, .mdUP table td{padding: 5px;text-align:center;border:1px solid #ccc;}
...
Guide to Flexbox
pre{padding:4px;margin:5px 0;border-radius:0;color:#fff;background:#333;border:none;}
Introduction :
The flexible box called as flexbox is an powerful idea to give the container ability to alter their items
You can adjust child eleme...
Css3 transition effect
Hello Readers
This blog will describe about, what is transition property in CSS3.
transition property
The transition property specifies the name of the CSS property, the transition effect starts when the specified CSS property changes). CSS3 ...
stylish check box using pure css
Hi all,
Below is an example of custom check box, using pure css here is no any script.
You can use this example many type, like to select some image or theme. I hope it will helps you somewhere.
HTML:-
<div class="wrap">
...
CSS3 Selectors
pre{padding:4px;border-radius:0px;}
Hi all,
Selector are the basic component in the CSS. Here's a definition of the selector from W3C documentation -
A Selector represents a structure. This structure can be used as a condition (e.g. in...
Including video on web pages
Hello all
I need some help regarding in HTML, the problem is that I want to include video lectures on my web page, I want to dynamically update the lectures in the web page which I add on the default folder for video lectures . can you please s...
How to set a type on buttons
The default value is submit, meaning any button in a form can submit the form. Use type="button" for anything that doesn't submit the form and type="submit" for those that do.
<button type="submit">Save changes</button>
<button...
Switch list/grid view using jQuery
Hi all,
Below is an example of switching between list and grid view using jQuery.
$( document ).ready(function() {
$('.show-list').click(function(){
$('.wrapper').addClass('list-mode');
});
$('.hide-list').c...
How nth-child Works ?
Hi folks,
The :nth-child(n) selector is a pseudo element. which show the position on there parents element.
You can use (even) and (odd) for all even or odd child element.
:nth-child(odd)
For example:-
tr:nth-child(2n+1)
Rep...
Simple custom dropdown by using css
Hello Readers
Here is the example of custom drop down by using Css and HTML.
Here is the HTML
<div class="container">
<div class="customSelect">
<span class="arrow"></span>
<select i...
Use of prefix in css3
Hello Readers,
As we all knows that The CSS3 property allows you to add depth to your website's design without the need for images or extra container elements but when we use these property.
For Css3 it is vital that it works on all browser...
Flipping a div by css3
Hello Readers
Here is the example of
Flipping a div with css3 transitions and 3d transforms.
<div id="container">
<div id="card">
<div class="frontFace">
<h2>Hover Me to view effect</h2>...
CSS support guide
Hello all,
below is a list of
a complete CSS support for every mobile, web and desktop email.
*{margin:0;padding:0;}
.mybox table{font-size: 13px;font-family:'arial';border-collapse: collapse;}
tr.header{height:auto;}
...
Meta tag and its uses
What is meta tag?
The <meta> tag gives metadata about the HTML document.
It is a machine parsable and the metadata will not be displayed on the page.
These elements are typically used to specify page description, keywords, author of the ...
Same class not working properly on different element
Hi all,
I have a question about class performance, i use a class on two element first is an input type button and second is an anchor tag (a) both are looking different.
Why it happens can anybody have any proper answer.
Thank you in adv...
How to make simple Overlay popup ?
Hello readers!
Here is Example of Overlay popup. It is very simple and responsive.
Hope it will helps you somewhere.
Html:-
<div class="container-popup"></div>
<div class="popup">
<span id="close">...
HTML5 Brings Future into Technology
HTML5 is the revolution which the web technology needs in today's competitive environment. If we look at the recently launched application in the market then we learn that HTML5 is the future platform for the web application development. Whether ...
what is clearfix?
Hello readers !
Today We will discuss about clearfix
If you have any floating div inside a container and want to clear the floats normally you may are using clear:both class because this is simplest and most common way to solve this. But it...
Sticky footer using pure css
Hello folks!
The below code is an example of sticky footer using pure CSS. There are other sticky footer methods, which people use but the problem arises that they do not work with all browsers so the method I am providing below will work with...
HTML5 Page Structure
Hello readers!
Here is demo of HTML5 page structure. In this structure we are using semantic elements, so its also called Semantic HTML5 Page Layout.
Semantic Elements :- In many website we see html write like shown below-
<div class...
To Make a Preloader Using HTML and CSS
Hello readers,
If you want to make a preloader using HTML and CSS follow the below code:
Html
<div class="circle">
<div class="inner">
<div class="spot"></div>
</div>
</div>
<...
How to make simple calculator with the help of Angulor JS
This Script will helpful to make a simple 'addition' 'subtraction' 'multiplication' 'division' calculator with the help of Angular JS.
<!DOCTYPE html >
<html>
<head>
<title>Angulor Calculator</title>
&...
Use of Box Sizing
What is box-sizing ?
Box-sizing is a css3 property. It is used to tell browser that width padding border should include the object according to size, which is define by user.
For example, you have a text area with 100% widt...
Use of css Property calc()
Hello readers !
In this blog we will discuss on a css property named calc().
What is calc() ?
This is a way to change simply any numeric value in CSS automatically. like height, width, margin, padding, font-size, background-position etc ...
Creating Horizontal Menu Bar Using Html and CSS
Hello readers,
If you want to create a horizontal menu bar in a web page using HTML and CSS follow the below code.
CSS:-
<style type="text/css">
#menu
{
font-family: Arial, Verdana;
font-size: 14px;
margin: 0;
...
Typography viewport size
Hello reader,
In this blog we will discuss about,
how to manage font size in different viewport.
Usually we fix the font size with different viewport size using @media.
But as we know CSS3 has some new values. Viewport size: vw, vh, and vm...
Make a shape using css
Hello reader !
If you want to make a shape using pure css (after and before pseudo Elements) without using any images follow the code below.
.wrapper{
height: 220px;
width:500px;
margin: 0 auto;
}
.wrapper .midtop{
mar...
Evon Logo Using CSS
Hello readers !
Here is an example of css3 by using these codes you can make any logo. There is no use of any image. For example I used the same code to make Evon Logo. If you want to use the same code for creating other logo you have to do so...
