Tuesday, January 21, 2014

Tab Hexa Value_html (Script)

tab create and select color by background color

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>BANBEIS</title>

<!--start  Topmenu form page -->
<script type="text/javascript">

function colorToHex(color) {
    if (color.substr(0, 1) === '#') {
        return color;
    }
    var digits = /(.*?)rgb\((\d+), (\d+), (\d+)\)/.exec(color);
   
    var red = parseInt(digits[2]);
    var green = parseInt(digits[3]);
    var blue = parseInt(digits[4]);
   
    var rgb = blue | (green << 8) | (red << 16);
   
    hexvlue=digits[1] + '#' + rgb.toString(16);
    //alert(hexvlue);
    return hexvlue;
   
};
var firstColor;
function ChangeColorMouseOver(elementid)
{
 
    var tryId = document.getElementById(elementid).style.backgroundColor;
    firstColor=colorToHex(tryId);
     
      document.getElementById(elementid).style.background = "#D9E9DA";

 

}
function ChangebackMouseOut(elementid)
{
  document.getElementById(elementid).style.background = firstColor;



}
</script>

<!--End  Topmenu form page -->
</head>
<body>







 <!-- Start tab-->
 <div id="tab_create" style="width:812px;height:30px; background:none;">


 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="general_page" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center; ">
        <a  href="generalInfoEntryFormSchool.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px; color:#000;">1st page</a>
        </div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="vouto_one" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="voutoFacilitiesInfoEntryForm1School.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">2nd page</a></div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="vouto_two" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="voutoFacilitiesInfoEntryForm2School.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">3rd page</a></div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="student_one" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="studentInfoEntryForm1SchSec.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">4th page</a></div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="student_two" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="studentInfoEntryForm2SchThird.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">5th page</a></div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="student_three" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="studentInfoEntryForm3SchFourth.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">6th page</a></div>
 </div>

 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="teacher_one" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="teacherEmployeeInfoEntryForm1SchFifth.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">7th page</a></div>
 </div>


 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="teacher_two" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="teacherEmployeeInfoEntryForm2SchSixth.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">8th page</a></div>
 </div>


 <div onMouseOver="ChangeColorMouseOver(this.id)" onMouseOut="ChangebackMouseOut(this.id)" id="teacher_three" style="width:88px !important; width:88px;height:30px; float:left; background-color:#A2BE82;border-right: solid 1px #EDF0F5;">
        <div style="margin-top: 4px;text-align:center;"><a href="teacherEmployeeInfoEntryForm3SchSixth.do?eiin=<s:property value='institutesInfo.eiin'/>&&year=<s:property value='#session.year'/>" id="" style="text-decoration:none;font-family:Arial; font-weight:bold; font-size:13px;color:#000;">9th page</a></div>
 </div>


</div>
<!-- End tab-->





</body>


<script>
document.getElementById("general_page").style.backgroundColor='#FF3E3E';
//document.getElementById("general_page").style.backgroundColor='red';       
</script>

<!--N.B : This script color must be color code not declare red -->




curve image

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<style type="text/css">
*{
    margin:0 auto;
    padding:0;
    text-align:center;
}
div{
    width:400px;
    height:200px;
    background:#000;
    border:red solid 1px;
    margin-bottom:20px;
    color:#fff;
    text-align:center;
}
.curved {
-moz-border-radius:10px;
-webkit-border-radius:10px;
behavior:url(border-radius.htc);
}
div.img{
    border:1px solid #fff;
    background:url(karzzz.jpg) no-repeat;
    color:red;
    text-align:right;
}
</style>
</head>

<body>

<div class="img">Image</div>
<div class="curved">Curvd div</div>
<div class="img curved">Image got cured</div>

</body>
</html>




couple_Setcombo_inputField.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<script language="javascript">
function getCoupleDetails(div_id){
alert("l");
        var coupleType = (div_id.options[div_id.selectedIndex].value);
       
        //alert("Id :"+districtId);
        if(coupleType == '0'){
            //alert("Please select a Dose Type!");
                document.getElementById('details_select').value = 'none';
        }
       
        if(coupleType == '1'){
            //alert("Please select a Dose Type!");
                document.getElementById('details_select').value = 'wife';
        }
       
        if(coupleType == '2'){
            //alert("Please select a Dose Type!");
                document.getElementById('details_select').value = 'husband';
               
        }
    }
       
       
</script>

<body>
    <div>one :
      <select id="kSelect" name="kSelect" onChange="getCoupleDetails(this);">
        <option value="0">Select one</option>
        <option value="1">Husband</option>
        <option value="2">Wife</option>
      </select>
</div>
   
    <div style="margin-top:10px;">two :
      <input type="text" id="details_select" name="details_select" value="" style="width:132px;"/>
    </div>
</body>
</html>



2 combo couple.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<script language="javascript">
function getCoupleDetails(div_id){
alert("l");
        var coupleType = (div_id.options[div_id.selectedIndex].value);
       
        //alert("Id :"+districtId);
        if(coupleType == '0'){
            //alert("Please select a Dose Type!");
                 document.getElementById('RSelect').getElementsByTagName('option')[0].selected = 'selected';
        }
       
        if(coupleType == '1'){
            //alert("Please select a Dose Type!");
                 document.getElementById('RSelect').getElementsByTagName('option')[2].selected = 'selected';
               
        }
       
        if(coupleType == '2'){
            //alert("Please select a Dose Type!");
                document.getElementById('RSelect').getElementsByTagName('option')[1].selected = 'selected';
               
        }
    }
       
       
</script>

<body>
    <div>one :
      <select id="kSelect" name="kSelect" onChange="getCoupleDetails(this);">
        <option value="0">Select one</option>
        <option value="1">Husband</option>
        <option value="2">Wife</option>
      </select>
</div>
   
    <div style="margin-top:10px;">two :
      <select id="RSelect" name="RSelect" onChange="getCoupleDetailsHH(this);">
        <option value="0">Select one</option>
        <option value="1">Husband</option>
        <option value="2">Wife</option>
      </select>
    </div>
</body>
</html>
Posted by at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)