Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- Assignment 6a
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- </head>
- <body style="background-color: grey;">
- <h2 id="h">Plz press some keys in the text box</h2>
- <input type="text" id="result"/><br/><br/>
- <button id="b">10</button>
- <script>
- c=10;
- s="";
- $('#result').keypress(function(event)
- {
- c=c-1;
- key=String.fromCharCode(event.which);
- s=s+key;
- $('#b').html(c);
- event.preventDefault();
- if(c==0)
- {
- $('#h').html("Pressed chars are displayed in text box with bold and green color");
- $('#b').remove();
- $('#result').val(s);
- $('#result').css({'font-weight':'bold','color':'green'});
- }
- });
- </script>
- </body>
- </html>
- Assignmnet6b
- <!DOCTYPE html>
- <!--
- To change this license header, choose License Headers in Project Properties.
- To change this template file, choose Tools | Templates
- and open the template in the editor.
- -->
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- <style>
- #ball{position :relative;}
- #box{width :600px;height :600px; background-color: peachpuff; border: 1px solid blue;}
- </style>
- </head>
- <body>
- <div id="box">
- <img id="ball" alt="BALL" src="ball.PNG" width="50" height="50"/>
- </div>
- <button id="b1" style="color: black;position: absolute;top: 50px;left: 1000px;font-size: 2.3em;">TOP</button>
- <button id="b2" style="color: black;position: absolute;top: 150px;left: 1000px;font-size: 2.3em;">LEFT</button>
- <button id="b3" style="color: black;position: absolute;top: 250px;left: 1000px;font-size: 2.3em;">BOTTOM</button>
- <button id="b4" style="color: black;position: absolute;top: 350px;left: 1000px;font-size: 2.3em;">RIGHT</button>
- <script>
- var t=0,l=0,r=0,b=0;
- function calt()
- {
- t=t+1;
- $('#b1').html("TOP : "+t);
- if(t==15)
- {
- $('#b1').html("Winner!");
- $('#b1').css('color','red');
- $('#ball').css('position','static');
- event.preventDefault();
- }
- }
- function call()
- {
- l=l+1;
- $('#b2').html("LEFT : "+l);
- if(l==15)
- {
- $('#b2').html("Reached the count,Winner!");
- $('#b2').css('color','red');
- $('#ball').css('position','static');
- event.preventDefault();
- }
- }
- function calb()
- {
- b=b+1;
- $('#b3').html("BOTTOM : "+b);
- if(b==15)
- {
- $('#b3').html("Reached the count,Winner!");
- $('#b3').css('color','red');
- $('#ball').css('position','static');
- event.preventDefault();
- }
- }
- function calr()
- {
- r=r+1;
- $('#b4').html("RIGHT : "+r);
- if(r==15)
- {
- $('#b4').html("Reached the count,Winner!");
- $('#b4').css('color','red');
- $('#ball').css('position','static');
- event.preventDefault();
- }
- }
- function bounce()
- {
- $('#ball').fadeOut().fadeIn(2000);
- $('#ball').animate({left:'300px',top:'0px'},'slow','linear',calt);
- $('#ball').fadeOut().fadeIn(2000);
- $('#ball').animate({left:'0px',top:'300px'},'slow','linear',call);
- $('#ball').fadeOut().fadeIn(2000);
- $('#ball').animate({left:'300px',top:'600px'},'slow','linear',calb);
- $('#ball').fadeOut().fadeIn(2000);
- $('#ball').animate({left:'600px',top:'300px'},'slow','linear',calr);
- bounce();
- }
- bounce();
- </script>
- </body>
- </html>
- Assignment6c
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- </head>
- <body>
- <h2>Are You Vegetarian or Non-Vegetarian?</h2>
- <pre><input type="radio" name="r1" value="veg" id="v"/>Vegetarian</pre>
- <pre><input type="radio" name="r1" value="nonveg" id="n"/>Non-Vegetarian</pre>
- <div></div>
- <script>
- $('#v').click(function()
- {
- $('div').empty().html("<a href='veg.html'>Visit Veg Site</a>");
- });
- $('#n').click(function()
- {
- $('div').empty().html("<a href='nonveg.html'>Visit Nonveg Site</a>");
- });
- </script>
- </body>
- </html>
- veg.html
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- </head>
- <body>
- <h1>Recipe : Price</h1>
- <pre>Chapati : 20/-</pre>
- <pre>Alu-parota : 20/-</pre>
- <pre>Zera-rice : 20/-</pre>
- <pre>Pannir : 20/-</pre>
- <div></div>
- <script>
- function msg()
- {
- alert("Your food is served , Enjoy it");
- }
- function f1()
- {
- $('button').remove();
- setTimeout(msg,1000);
- }
- $('pre').click(function()
- {
- v=($(this).html()).match(/[a-z A-Z -]+/);
- $('div').html("<button id='b'></button>");
- $('#b').html("you have placed order for : "+v);
- setTimeout(f1,4000);
- })
- </script>
- </body>
- </html>
- nonveg.html
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- </head>
- <body>
- <h1>Recipe : Price</h1>
- <pre>Chicken : 20/-</pre>
- <pre>Fish-fry : 20/-</pre>
- <pre>Egg-rice : 20/-</pre>
- <pre>Egg-masala : 20/-</pre>
- <div></div>
- <script>
- function msg()
- {
- alert("Your food is served , Enjoy it");
- }
- function f1()
- {
- $('button').remove();
- setTimeout(msg,1000);
- }
- $('pre').click(function()
- {
- v=($(this).html()).match(/[a-z A-Z -]+/);
- $('div').html("<button id='b'></button>");
- $('#b').html("you have placed order for : "+v);
- setTimeout(f1,4000);
- })
- </script>
- </body>
- </html>
- Assignmnet6d
- <html>
- <head>
- <script src="jquery-3.6.0.js"></script>
- </head>
- <body>
- <center><h2>Time Table</h2></center>
- <table align="center" cellpadding="10" cellspacing="5" border="2">
- <tr class="c1">
- <th>Day/Time</th>
- <th>8-9</th>
- <th>9-10</th>
- <th>10-11</th>
- <th>11-12</th>
- </tr>
- <tr>
- <th>Mon</th>
- <th>WT</th>
- <th>CD</th>
- <th> - </th>
- <th>CC</th>
- </tr>
- <tr>
- <th>Tue</th>
- <th> - </th>
- <th>WT</th>
- <th>CD</th>
- <th>CC</th>
- </tr>
- <tr class="c3">
- <th>Wed</th>
- <th> - </th>
- <th>CC</th>
- <th>WT</th>
- <th> - </th>
- </tr>
- <tr>
- <th>Thu</th>
- <th>OE</th>
- <th>CD</th>
- <th>WT</th>
- <th> - </th>
- </tr>
- <tr>
- <th>Fri</th>
- <th>OE</th>
- <th>CD</th>
- <th>WT</th>
- <th> - </th>
- </tr>
- </table>
- <button id="1" style="position: absolute;top: 215px;left: 1000px;font-weight: bold;">Change Wed</button>
- <script>
- $('#1').click(function()
- {
- $('.c1').siblings('.c3').css({'background-color':'red','color':'yellow','font-style':'italic'});
- });
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement