Create a web page using two image files, which switch between one another as the mouse pointer moves over the images. Use the on Mouse Over and on Mouse Out

<html>
<head>
<script type = "text/javascript">
    function mouseover()
    {
        document.getElementById("img").src = "image.jpg";
    }
    function mouseout()
    {
        document.getElementById("img").src = image1.jpg;
    }
</script>
</head>
<body>
<img src = "image1.jpg" id = "img" onmouseover="mouseover()" onmouseout="mouseout()"/>
</body>
</html>
34 comments:
Labels: ,

Write a JavaScript code block, which checks the contents entered in a form’s Text element. If the text entered is in the lower case, convert to upper case. Make use of function to Uppercase ( ).

<html>
<head>
<script type = "text/javascript">
    function upper()
    {
        var upper = document.form1.string.value.toUpperCase();
        document.form1.string.value = upper;
    }
</script>
</head>
<body>
    <form name = "form1">
        <table>
            <tr>
                <td>Enter String</td>
                <td><input type = "text" name = "string" /></td>
            </tr>
            <tr>
                <td><input type = "button" value = "upper" onclick = "upper()"></td>
            </tr>
        </table>
    </form>
</body>
</html>
14 comments:
Labels: ,

Create a form consists of a two Multiple choice lists and one single choice list,

<html>
<head>
    <script type = "text/javascript">
        function findcost()
        {
            var major = document.getElementById("major");
            var Starters = document.getElementById("starters");
            var soft = document.getElementById("soft");
            var s = "Item \t \t \t Price \n--------------------------------\n";
            var totalcost = 0;
       
            for( var i = 0; i < major.options.length; i++)
            {
                var option = major.options[i];
                if(option.selected == true)
                {
                    var price = parseInt(option.value);
                    totalcost = totalcost + price;
                    s = s+ option.text + "\t \t" + price + "\n";
                }
            }
            for( var i = 0; i < starters.options.length; i++)
            {
                var option = starters.options[i];
                if(option.selected == true)
                {
                    var price = parseInt(option.value);
                    totalcost = totalcost + price;
                    s = s + option.text + "\t \t" + price + "\n";
                }
            }
            var softdrinkindex = soft.selectedIndex;
            if(softdrinkindex != null)
            {
                var selectedsoftdrink = soft.options[soft.selectedIndex].text;
                var price = parseInt(soft.options[soft.selectedIndex].value);
                totalcost = totalcost + price;
                s = s + selectedsoftdrink + "\t \t" + price + "\n";
            }
            s = s + "\n\n Total Cost \t \t" + totalcost;
            document.getElementById("ordereditems").value = s;
        }
    </script>
</head>
<body>
    <form name = "menuForm">
        <table border = "1" >
            <tr>
                <td colspan = "2" align = "center">
                    <h2>Restaurant Menu Details</h2>
                </td>
            </tr>
            <tr>
                <td> Major Dishes:</td>
                <td>
                    <select id = "major" size = "3" multiple = "multiple">
                        <option value = "100"> Vegetable Pulav</option>
                        <option value = "150"> Hyderabadi Biriyani</option>
                        <option value = "50"> Roti with Curry </option>
                    </select>
                </td>
            </tr>
            <tr>
                <td> Starters </td>
                <td> <select id = "starters" size = "3" multiple = "multiple">
                    <option value = "80"> Gobi Manchurian </option>
                    <option value = "40"> Veg Clear Soup </option>
                    <option value = "30"> Masala Papad </option>
                </td>
            </tr>
            <tr>
                <td>Soft Drinks</td>
                <td>
                    <select id = "soft" size = "3" multiple = "multiple">
                        <option value = "20"> Pepsi</option>
                        <option value = "25"> Coke </option>
                        <option value = "30"> Lime Soda </option>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan = "2" align = "center">
                    <textarea id = "ordereditems" rows = "10" cols = "40">
                   
                    </textarea>
                </td>
            </tr>
            <tr>
                <td>
                    <input type = "button" value = "Find total Cost" onclick = "findcost()" />
                </td>
                <td>
                    <input type = "reset" value = "Clear" />
                </td>
            </tr>
        </table>
    </form>
</body>
</html>
105 comments:
Labels: ,

Create a form for Employee information. Write JavaScript code to find DA, HRA, PF, TAX, Gross pay, Deduction and Net pay.

<html>
<head>
<title>Registration Form</title>
<script type = "text/javascript">
    function calc()
    {
        var bp,DA,HRA,GP,PF,Tax,Deduction,NetPay,name,id,desg;
        name = document.form1.firstname.value;
        id = document.form1.userid.value;
        desg = document.form1.designation.value;
        bp = parseInt(document.form1.bp.value);

        DA = bp * 0.5;
        HRA = bp * 0.5;
        GP = bp + DA + HRA;
        PF = GP * 0.02;
        Tax = GP * 0.01;
        Deduction = Tax + PF;
        NetPay = GP - Deduction;

        document.form1.da.value = DA;
        document.form1.hra.value = HRA;
        document.form1.gp.value = GP;
        document.form1.pf.value = PF;
        document.form1.tax.value = Tax;
        document.form1.deduction.value = Deduction;
        document.form1.netpay.value = NetPay
    }
</script>
</head>
<body >
    <form name = "form1">
        <table border = "1">
            <tr>
                <td>Name</td>
                <td><input type = "text" name = "firstname" /></td>
            </tr>
            <tr>
                <td>User ID</td>
                <td><input type = "text" name = "userid" /></td>
            </tr>
            <tr>
                <td>Designation</td>
                <td><input type = "text" name = "designation" /></td>
            </tr>
            <tr>
                <td>Basic Pay</td>
                <td><input type = "text" name = "bp"></td>
            </tr>
            <tr>
                <td colspan = "2" align = "center">
                <input type = "button" name = "calculate" value = "Click Here To Calculate"onclick ="calc()"></td>

            </tr>
            <tr>
                <td>Dearness Allowance </td>
                <td><input type = "text" name = "da"/></td>
            </tr>
            <tr>
                <td>House Rent Allowance </td>
                <td><input type = "text" name = "hra"></td>
            </tr>
            <tr>
                <td>GP</td>
                <td><input type = "text" name = "gp"></td>
            </tr>
            <tr>
                <td>Provident Fund</td>
                <td><input type = "text" name = "pf" /></td>
            </tr>
            <tr>
                <td>Tax</td>
                <td><input type = "text" name = "tax" /></td>
            </tr>
            <tr>
                <td>Deduction</td>
                <td><input type = "text" name = "deduction" /></td>
            </tr>
            <tr>
                <td>NetPay</td>
                <td><input type = "text" name = "netpay" /></td>
            </tr>           
        </table>
    </form>
</body>
</html>
78 comments:
Labels: ,
Subscribe to: Posts (Atom)