Shopping cart0.00₹

Multimedia & Animation Solved Question Paper 2024 (Reg/Rep)

Time: 2 Hrs | Max. Marks: 60

Section - A

I. Answer any TEN questions. (10×2=20)

1. Define HTML.

HTML (Hypertext Markup Language) is the standard markup language used to create and design web pages. It structures content on the web using elements and tags.

2. Define JavaScript.

JavaScript is a scripting language used to create dynamic and interactive web content. It runs on the client side and can manipulate HTML and CSS.

3. What is Animation?

Animation is the process of creating the illusion of motion by displaying a sequence of static images (frames) in rapid succession.

4. Define Interpolation.

Interpolation is a method of constructing new data points within the range of a discrete set of known data points, often used in animation for smooth transitions.

5. List any four font properties.

  • font-family. 

  • font-size. 

  • font-weight.

  • font-style.

6. Define SVG.

SVG (Scalable Vector Graphics) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation.

7. What is the use of canvas in HTML?

The HTML<canvas> element is used to draw graphics, animations, or other visual content dynamically using JavaScript.

8. List any Four Basic HTML tags.

  • <html> 

  • <head>

  • <body> 

  • <p>

9. Define span tag with example.

The <span> tag is an inline container used to mark up a part of a text or document.

Example:

<p>This is a <span style="color:red">red</span> word.</p>
10. What is CSS?

CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of a document written in HTML.

11. Define transition.

In CSS, a transition allows you to change property values smoothly over a given duration, creating animation effects.

 

12. Define Div tag with example.

The <div> tag is a block-level container used to group other HTML elements for styling or scripting.

Example:

<div style="background-color:lightblue">
  <p>This is a paragraph inside a div.</p>
</div>

Section - B

II. Answer any FOUR of the following. (4×5=20)

13. What are the characteristics of JavaScript?
  • Client-side scripting: Runs in the user’s browser.
  • Event-driven: Responds to user actions like clicks.
  • Dynamic typing: Variables can hold any data type.
  • Prototype-based: Uses prototypes for inheritance.
  • Interpreted: Executed line by line without compilation.
14. Explain longhand properties with example.

Longhand properties are the individual CSS properties that make up shorthand properties. They allow you to specify each aspect of a style separately, giving you more precise control over the styling.

When CSS provides a shorthand property (like background, margin, or font), it’s actually combining several individual properties. The individual properties that make up these shorthands are called longhand properties.

Example:

Shorthand:

.box {
  margin: 10px 15px 5px 20px;
}

Equivalent Longhand:

.box {
  margin-top: 10px;
  margin-right: 15px;
  margin-bottom: 5px;
  margin-left: 20px;
}
15. Write a program to demonstrate animation in reverse direction.
<!DOCTYPE html>
<html>
<head>
<style>
  #box {
    width: 50px;
    height: 50px;
    background-color: red;
    position: relative;
    animation: reverseMove 2s infinite alternate;
  }
  @keyframes reverseMove {
    from { left: 200px; }
    to { left: 0px; }
  }
</style>
</head>
<body>
  <div id="box"></div>
</body>
</html>
16. Explain form tag with example.

The <form> tag in HTML is used to create a container for interactive controls that allow users to submit information to a web server. It’s one of the most important elements for collecting user input on websites.

  1. action: Specifies where to send the form data when submitted

  2. method: Defines how to send the form data (GET or POST)

  3. enctype: Specifies how form data should be encoded (important for file uploads)

  4. target: Where to display the response after submission

Syntax:

<form action="destination-url" method="submission-method">
    <!-- form controls go here -->
</form>

Common Form Controls:

  1. Text Input: <input type="text">

  2. Password Input: <input type="password">

  3. Email Input: <input type="email">

  4. Radio Buttons: <input type="radio">

  5. Checkboxes: <input type="checkbox">

  6. Dropdown Menus: <select> with <option> elements

  7. Text Areas: <textarea>

  8. Submit Button: <input type="submit"> or <button type="submit">

Example:

<form action="/submit" method="post">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name"><br>
  <input type="submit" value="Submit">
</form>
or 
<!DOCTYPE html>
<html>
<head>
    <title>Contact Form Example</title>
</head>
<body>
    <h2>Contact Us</h2>
    <form action="/submit-form" method="POST">
        <!-- Text input -->
        <label for="name">Full Name:</label><br>
        <input type="text" id="name" name="name" required><br><br>
        
        <!-- Email input -->
        <label for="email">Email:</label><br>
        <input type="email" id="email" name="email" required><br><br>
        
        <!-- Dropdown menu -->
        <label for="subject">Subject:</label><br>
        <select id="subject" name="subject">
            <option value="general">General Inquiry</option>
            <option value="support">Technical Support</option>
            <option value="feedback">Feedback</option>
        </select><br><br>
        
        <!-- Textarea -->
        <label for="message">Message:</label><br>
        <textarea id="message" name="message" rows="4" cols="50" required></textarea><br><br>
        
        <!-- Radio buttons -->
        <label>Preferred Contact Method:</label><br>
        <input type="radio" id="contact-email" name="contact-method" value="email" checked>
        <label for="contact-email">Email</label><br>
        <input type="radio" id="contact-phone" name="contact-method" value="phone">
        <label for="contact-phone">Phone</label><br><br>
        
        <!-- Checkbox -->
        <input type="checkbox" id="subscribe" name="subscribe" value="yes">
        <label for="subscribe">Subscribe to newsletter</label><br><br>
        
        <!-- Submit button -->
        <input type="submit" value="Send Message">
    </form>
</body>
</html>
17. Write a program to demonstrate "StrokeText()" method using HTML Canvas.
<!DOCTYPE html>
<html>
<body>
  <canvas id="myCanvas" width="300" height="100"></canvas>
  <script>
    var canvas = document.getElementById("myCanvas");
    var ctx = canvas.getContext("2d");
    ctx.font = "30px Arial";
    ctx.strokeText("Hello World", 50, 50);
  </script>
</body>
</html>

Section - C

Answer any Two questions. (2×10=20)

18. Explain levels of stylesheets with example.

1. Inline Styles

  • Applied directly within an HTML tag using the style attribute.

  • Highest priority, overrides other styles.

Example:

<p style="color: red;">This is red text.</p>

2. Internal Stylesheet

  • Written inside a <style> tag within the <head> of the HTML document.

  • Used when styling a single HTML document.

Example:

<head>
  <style>
    p {
      color: green;
    }
  </style>
</head>
<body>
  <p>This is green text.</p>
</body>

3. External Stylesheet

  • Written in a separate CSS file (e.g., style.css).

  • Linked using the <link> tag in the <head> section.

  • Best for reusing styles across multiple pages.

Example:

HTML:

 

<link rel="stylesheet" href="style.css">
<p>This is styled externally.</p>

style.css:

p {
  color: blue;
}
19. Write a short note on
a) Screen output and keyboard input with example.

Java provides standard methods for output to screen and input from keyboard.

Screen Output:

  • Use System.out.println() to display output on the console.

Keyboard Input:

  • Use Scanner class from java.util package.

Example:

import java.util.Scanner;

public class InputOutputExample {
    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);  // Keyboard input
        System.out.print("Enter your name: ");
        String name = sc.nextLine();          // Reading input
        System.out.println("Hello, " + name); // Output
    }
}
b) Working with multiple transitions.

In CSS, transitions animate the change from one style to another. You can apply multiple transitions to multiple properties.

Syntax:

selector {
  transition: property1 duration1, property2 duration2, ...;
}

 Example:

<style>
  div {
    width: 100px;
    height: 100px;
    background-color: red;
    transition: width 2s, background-color 1s;
  }
  div:hover {
    width: 200px;
    background-color: blue;
  }
</style

<button class="fancy-btn">Hover Me</button>
20. Write a program to demonstrate different line patterns with different colors using canvas.

Java AWT Program to Draw Line Patterns with Colors

import java.awt.*;
import javax.swing.*;

public class LinePatternCanvas extends Canvas {

    // Constructor to set canvas size
    public LinePatternCanvas() {
        setSize(400, 400);
    }

    // Override paint() to draw lines
    public void paint(Graphics g) {
        // Set background color
        setBackground(Color.WHITE);

        // Draw red diagonal line
        g.setColor(Color.RED);
        g.drawLine(50, 50, 200, 200);

        // Draw green horizontal line
        g.setColor(Color.GREEN);
        g.drawLine(50, 100, 250, 100);

        // Draw blue vertical line
        g.setColor(Color.BLUE);
        g.drawLine(150, 50, 150, 250);

        // Draw orange zig-zag pattern
        g.setColor(Color.ORANGE);
        for (int i = 0; i < 5; i++) {
            g.drawLine(50 + i * 30, 300, 70 + i * 30, 270);
            g.drawLine(70 + i * 30, 270, 90 + i * 30, 300);
        }
    }

    // Main method to display the canvas in a frame
    public static void main(String[] args) {
        Frame frame = new Frame("Line Patterns with Colors");
        LinePatternCanvas canvas = new LinePatternCanvas();

        frame.add(canvas);
        frame.setSize(450, 450);
        frame.setVisible(true);

        // Close the frame on window close
        frame.addWindowListener(new java.awt.event.WindowAdapter() {
            public void windowClosing(java.awt.event.WindowEvent e) {
                frame.dispose();
            }
        });
    }
}

    Leave a Reply

    Your email address will not be published. Required fields are marked *

    error: Content is protected !!