How to javascript hide and show option in via checkbox ?

December 24th, 2011 Posted in HTML Techniques, Javascript, Web Tutorials
No Comments

You just put below code in your template style :

// Checked for Display Div Start
function fnchecked(blnchecked){
if(blnchecked){
document.getElementById(“webAddress”).style.display = “block”;
document.getElementById(“wwebAddress”).style.display = “block”;
document.getElementById(“wwebAddress”).style.height = “20px”;
//document.getElementById(“customers_wwebaddress”).value = “”;
}
else{
document.getElementById(“webAddress”).style.display = “none”;
document.getElementById(“wwebAddress”).value = “”;
document.getElementById(“wwebAddress”).style.display = “none”;
document.getElementById(“wwebAddress”).style.height = “0.1em”;
}
}

Finally call that function below textbox inside :

<input type=”text” onclick=”fnchecked(this.checked);” />

, ,
Read More

How to avoid li bottom extra space in IE7?

December 12th, 2011 Posted in HTML Techniques, HTML Tutorial, Web Tutorials
No Comments

You Just Avoid Space for li.

This is rank for IE 7 :
<ul>
<li>First</li>
<li>Second</li>
</ul>


You can use this code solve your problem :
<ul>
 <li>First</li><!--
--><li>Second</li><!--
--><li>Three</li>
</ul>

(OR)

<ul>
<li>First</li
><li>Second</li
><li>Three</li>
</ul>

(OR)

<ul><li>First</li><li>Second</li><li>Three</li></ul>


This is solved unwanted bottom space.
, , , , ,
Read More

IF IE CSS Menu not Working?

November 18th, 2011 Posted in HTML Techniques, HTML Tutorial, Web Tutorials
No Comments

You Can use below doctype in your html page inside.

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>

this is working good one.

, , , , ,
Read More

How to set Cross Browser Min Height in Via CSS?

November 12th, 2011 Posted in CSS Tutorials, HTML Techniques, HTML Tutorial, Web Tutorials
No Comments

You Can Just Below Code in your style sheet OR where you want you can put this.

min-height:741px;
height:auto !important;
height:741px;

that is all this is working well i can find this in google via.

, , , ,
Read More

How to Define HTML head?

July 19th, 2011 Posted in HTML Techniques, HTML Tutorial, Web Tutorials
No Comments

You can Easily create very simple html Tag :

<h1> </h1> — This first Head Tag

<h2> </h2> — This Second Head Tag

<h3> </h3> — This thrid Head Tag

<h4> </h4> — This Fourth Head Tag

<h5> </h5> — This Fivth Head Tag

<h6> </h6> — This Sixth Head Tag

Example :

<h1> :

Example H1

<h2> :

Example H2

<h3> :

Example H3

<h4> :

Example H4

<h5> :

Example H5

<h6> :

Example H6

this is very easy. Enjoy 🙂

, , , , , , , , , ,
Read More

Which Fonts all Browser Supported Fonts?

July 6th, 2011 Posted in HTML Techniques, Web Tutorials
No Comments
Windows fonts / Mac fonts / Font family
Normal style Bold style
Arial, Arial, Helvetica, sans-serif Arial, Arial, Helvetica, sans-serif
Arial Black, Arial Black, Gadget, sans-serif Arial Black, Arial Black, Gadget, sans-serif
Comic Sans MS, Comic Sans MS5, cursive Comic Sans MS, Comic Sans MS5, cursive
Courier New, Courier New, monospace Courier New, Courier New, monospace
Georgia1, Georgia, serif Georgia1, Georgia, serif
Impact, Impact5, Charcoal6, sans-serif Impact, Impact5, Charcoal6, sans-serif
Lucida Console, Monaco5, monospace Lucida Console, Monaco5, monospace
Lucida Sans Unicode, Lucida Grande, sans-serif Lucida Sans Unicode, Lucida Grande, sans-serif
Palatino Linotype, Book Antiqua3, Palatino, serif Palatino Linotype, Book Antiqua3, Palatino, serif
Tahoma, Geneva, sans-serif Tahoma, Geneva, sans-serif
Times New Roman, Times New Roman, Times, serif Times New Roman, Times New Roman, Times, serif
Trebuchet MS1, Trebuchet MS, sans-serif Trebuchet MS1, Trebuchet MS, sans-serif
Verdana, Verdana, Geneva, sans-serif Verdana, Verdana, Geneva, sans-serif
Symbol, Symbol (Symbol2, Symbol2) Symbol, Symbol (Symbol2, Symbol2)
Webdings, Webdings (Webdings2, Webdings2) Webdings, Webdings (Webdings2, Webdings2)
Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2) Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2)
MS Sans Serif4, Geneva, sans-serif MS Sans Serif4, Geneva, sans-serif
MS Serif4, New York6, serif MS Serif4, New York6, serif
, , , , , , , , , , , , , , , , , , , , ,
Read More

How to create wp curve menu css ?

April 20th, 2011 Posted in CSS Tutorials, HTML Techniques, PHP Tutorials, Web Tutorials, Wordpress
No Comments

You can use below coding that is useful for curve menu creation.

/* =Menu
————————————————————– */
#top-bar-bg{
background: #820086;
border-bottom:8px solid #000;
padding:20px 0 0 0;

}
div.search_container{
position:absolute;
top:0;
right:0;
}
div.search_container input.keywords{
font:12px Arial, Helvetica, sans-serif;
float:left;
}
#access {
display: block;
margin: 0 auto;
width: 940px;
position:relative;
}
#access .menu-header,
div.menu {
font-size: 13px;
margin-left: 12px;
width: 928px;
}
#access .menu-header ul,
div.menu ul {
list-style: none;
margin: 0;
}
#access .menu-header li,
div.menu li {
float: left;
position: relative;
}
#access a {
display: block;
line-height: 38px;
text-decoration: none;
/*-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;*/
font:14px Arial, Helvetica, sans-serif;
padding:10px;
}
#access ul li {
color: #9D9B9B;
background:url(images/menu-normal-right.jpg) no-repeat top right;
margin-right:10px;
}
#access ul li a{
color: #9D9B9B;
background:url(images/menu-normal-left.jpg) no-repeat top left;
}

#access ul ul {
/*box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);*/
display: none;
position: absolute;
top: 38px;
left: 0;
float: left;
width: 180px;
z-index: 99999;
}
#access ul ul li {
min-width: 180px;
}
#access ul ul ul {
left: 100%;
top: 0;
}
#access ul ul a {
background: #333;
line-height: 1em;
padding: 10px;
width: 160px;
height: auto;
}
#access li:hover {
background:url(images/menu-hilight-right.jpg) no-repeat top right;
color: #000;
}
#access li:hover > a,
#access ul ul :hover > a {
background:url(images/menu-hilight-left.jpg) no-repeat top left;
color: #000;
}
#access ul li:hover > ul {
display: block;
}
#access ul li.current_page_item,
#access ul li.current-menu-ancestor,
#access ul li.current-menu-item,
#access ul li.current-menu-parent {
background:url(images/menu-hilight-right.jpg) no-repeat top right;
color: #000;

}
#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a {
background:url(images/menu-hilight-left.jpg) no-repeat top left;
color: #000;

}
* html #access ul li.current_page_item,
* html #access ul li.current-menu-ancestor,
* html #access ul li.current-menu-item,
* html #access ul li.current-menu-parent,
* html #access ul li{
background:url(images/menu-hilight-right.jpg) no-repeat top right;
color: #000;
}
* html #access ul li.current_page_item a,
* html #access ul li.current-menu-ancestor a,
* html #access ul li.current-menu-item a,
* html #access ul li.current-menu-parent a,
* html #access ul li a:hover {
background:url(images/menu-hilight-left.jpg) no-repeat top left;
color: #000;
}

that’s all. 🙂

Other one Option :

/* =Menu
————————————————————– */

#access {
display: block;
float: left;
margin: 0 auto 0 auto;
width: 500px;
height:29px;
position:absolute;
top:39px;
right:0px;
}
#access .menu-header,
#access .menu-header ul.menu {
font:12px “Myriad Pro”, Arial, Helvetica, sans-serif, Verdana;
color:#9CB2E4;
margin-left: 12px;
width: 420px;
float:right;
}
#access .menu-header ul,
#access .menu-header ul.menu ul {
list-style: none;
margin: 0;
}
#access .menu-header li,
#access .menu-header ul.menu li {
float: left;
position: relative;
padding:0 0 0 0;
}
#access .menu-header a {
color:#9CB2E4;
font:bold 12px “Trebuchet MS”, Arial, Helvetica, sans-serif;
text-decoration:none;
padding:13px 0 13px 0;
text-decoration: none;
background: url(images/topmenuright.gif) no-repeat right;
}
#access .menu-header ul li a span { padding:13px 15px; background: url(images/topmenuleft.gif) no-repeat left;}
#access .menu-header ul ul {
box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
display: none;
position: absolute;
top: 38px;
left: 0;
float: left;
width: 180px;
z-index: 99999;
}
#access .menu-header ul li a{
margin:0 5px;
float:left;
}
#access .menu-header ul ul li {
min-width: 180px;
padding:13px 10px;
}
#access .menu-header ul ul ul {
left: 100%;
top: 0;
}
#access .menu-header ul ul a {
/*background: transparent;*/
line-height: 1em;
padding: 15px;
width: 160px;
height: auto;
}
#access .menu-header li:hover > a,
#access .menu-header ul ul :hover > a {

color:#fff; background: url(images/topmenurighthover.gif) no-repeat right;
}
#access .menu-header li:hover > a span,
#access .menu-header ul ul :hover > a span{color:#fff; background:url(images/topmenulefthover.gif) no-repeat left; }

#access .menu-header ul li:hover > ul {
display: block;
}
#access .menu-header ul li.current_page_item > a,
#access .menu-header ul li.current-menu-ancestor > a,
#access .menu-header ul li.current-menu-item > a,
#access .menu-header ul li.current-menu-parent > a {
color:#fff; background:url(images/topmenurighthover.gif) no-repeat right;
}
#access .menu-header ul li.current_page_item > a span,
#access .menu-header ul li.current-menu-ancestor > a span,
#access .menu-header ul li.current-menu-item > a span,
#access .menu-header ul li.current-menu-parent > a span{
color:#fff; background:url(images/topmenulefthover.gif) no-repeat left; }

* html #access .menu-header ul li.current_page_item a,
* html #access .menu-header ul li.current-menu-ancestor a,
* html #access .menu-header ul li.current-menu-item a,
* html #access .menu-header ul li.current-menu-parent a,
* html #access .menu-header ul li a:hover {
color:#fff; background:url(images/topmenurighthover.gif) no-repeat right;
}
* html #access .menu-header ul li.current_page_item a span { color:#fff; background:url(images/topmenulefthover.gif) no-repeat left; }

, , , , , , , , , , , , , , , , , , ,
Read More

How to hide Browser Back and Forward Button?

April 13th, 2011 Posted in HTML Techniques, Javascript, Web Tutorials
No Comments

function disableBackButton()
{
window.history.forward();
}
setTimeout(“disableBackButton()”, 0);

1. And Go to Html Page

2.  Put the body onunload section area Below Code :

<body onUnLoad = “disableBackButton();”>

🙂

Read More

How After Submit and When back Button Press Form Field Reset ?

April 13th, 2011 Posted in HTML Techniques, Javascript, Web Tutorials
No Comments

function formclear(){
document.getElementById(‘uName’).value = ”;
document.getElementById(‘vorname’).value = ”;
document.getElementById(‘adresse’).value = ”;
document.getElementById(‘plz’).value = ”;
document.getElementById(‘ort’).value = ”;
document.getElementById(‘uEmail’).value = ”;
document.getElementById(‘uEmail2’).value = ”;
document.getElementById(‘agb_digital’).checked = false;
document.getElementById(‘sixLettersCode’).value = ”;
//document.enForm.reset();
}

And But Below Code in Body Section :

<body onLoad=”formclear()” onUnload=”formclear()”>

Read More

Curve Bg Css

March 30th, 2011 Posted in CSS Tutorials, General, HTML Techniques, Web Tutorials
No Comments

.left-panel{
width:605px;
float:left;
margin:25px 0;
}
div.panel-t-l{
background:url(images/curve-bg-t-l.png) no-repeat top left;
}
div.panel-t-l div.panel-t-r{
background:url(images/curve-bg-t-r.png) no-repeat top right;
padding:8px 0 0 0;
}

div.panel-b-l{
background:url(images/curve-bg-b-l.png) no-repeat bottom left;
}
div.panel-b-l div.panel-b-r{
background:url(images/curve-bg-b-r.png) no-repeat bottom right;
padding:0 0 8px 0;
}
.panel-white-bg{
background:#fff;
padding:10px 15px;
min-height:235px;
}

.right-panel{
margin:25px 0;
width:325px;
float:right;
}
div.panel-r-t-l{
background:url(images/panel-r-t-l.png) no-repeat top left;
}
div.panel-r-t-l div.panel-r-t-r{
background:url(images/panel-r-t-r.png) no-repeat top right;
padding:8px 0 0 0;
}

div.panel-b-r-l{
background:url(images/panel-b-r-l.png) no-repeat bottom left;
}
div.panel-b-r-l div.panel-b-r-r{
background:url(images/panel-b-r-r.png) no-repeat bottom right;
padding:0 0 8px 0;
}

Read More
Older Entries

© 2020 Spirituality