Scribd Logo
Upload

Welcome to Scribd!

  • 4 views

    Devoir JS

    Uploaded by

    SALMA CHAHBOUNE
    1. The document contains code for three HTML exercises involving image manipulation, text styling, and encryption/decryption. 2. The first exercise code allows enlarging and shrinking an image using buttons. The second allows changing text color and font size using dropdowns. 3. The third exercise code implements a Caesar cipher that encrypts/decrypts text based on a shift value, displaying the result. CSS is included to style elements for each exercise.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Devoir JS

    Uploaded by

    SALMA CHAHBOUNE
    4 views8 pages
    1. The document contains code for three HTML exercises involving image manipulation, text styling, and encryption/decryption. 2. The first exercise code allows enlarging and shrinking an image using buttons. The second allows changing text color and font size using dropdowns. 3. The third exercise code implements a Caesar cipher that encrypts/decrypts text based on a shift value, displaying the result. CSS is included to style elements for each exercise.

    Original Description:

    Original Title

    DEVOIR JS

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    1. The document contains code for three HTML exercises involving image manipulation, text styling, and encryption/decryption. 2. The first exercise code allows enlarging and shrinking an image using buttons. The second allows changing text color and font size using dropdowns. 3. The third exercise code implements a Caesar cipher that encrypts/decrypts text based on a shift value, displaying the result. CSS is included to style elements for each exercise.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    4 views8 pages

    Devoir JS

    Uploaded by

    SALMA CHAHBOUNE
    1. The document contains code for three HTML exercises involving image manipulation, text styling, and encryption/decryption. 2. The first exercise code allows enlarging and shrinking an image using buttons. The second allows changing text color and font size using dropdowns. 3. The third exercise code implements a Caesar cipher that encrypts/decrypts text based on a shift value, displaying the result. CSS is included to style elements for each exercise.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 8

    1

    1
    EXERCICE 1

    SMI S3
    DEVOIR J.S
    2021/2022

    SALMA CHAHBOUNE
    GROUPE :A0301
    CODE APOGEE :21000026

    2 1
    3
    4
    CODE HTML

    <html>
    <head>
    </head>
    <body>
    <img id="myImg"src="images.jpeg">
    <input type="button" value="+" onclick="
    myImg.style.height = '300px';
    myImg.style.width = '300px'">
    <input type="button" value="-" onclick="
    myImg.style.height = '100px';
    myImg.style.width = '150px';
    ">
    </body>

    </html>

    CAPTURE

    5 2
    6
    7

    EXERCICE 2
    CODE HTML
    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="dv.css">
    </head>
    <body>
    <h2>choisir la couleur et la taille de votre texte</h2>
    <textarea onfocus="myFunction()" id="demo"></textarea><br>
    <p>changer la couleur ici</p><select >
    <option id="red" >red</option>
    <option id="green">green</option>
    <option id="yellow">yellow</option>
    </select><br>
    <p>changer la taille de police ici</p><select >
    <option id="12">12</option>
    <option id="16">16</option>
    <option id="20">20</option>
    </select>
    <script>
    function myFunction() {
    if( document.getElementById("red").selected)
    document.getElementById("demo").style.color = "red";
    if( document.getElementById("green").selected)
    document.getElementById("demo").style.color = "green";
    if( document.getElementById("yellow").selected)
    document.getElementById("demo").style.color = "yellow";
    if( document.getElementById("12").selected)
    document.getElementById("demo").style.fontSize = "12px";
    if( document.getElementById("16").selected)
    document.getElementById("demo").style.fontSize = "16px";
    if( document.getElementById("20").selected)
    document.getElementById("demo").style.fontSize = "20px";
    }
    </script>

    8 3
    9
    10

    </body>
    </html>
    CODE CSS
    textarea {
    width: 20cm;
    height: 150px;
    background-color: #f8f8f8;
    }
    h2{color: darkblue;}
    p{ font-size: 20px; }
    select { width: 5cm;
    height: 28px;
    text-align:center;
    font-size: 20px;}
    CAPTURE

    11 4
    12
    13

    3 EXERCICE 3
    4 CODE HTML

    5 <!DOCTYPE html>

    6 <html>

    7 <head>

    8 <link rel="stylesheet" type="text/css" href="dvv3.css">

    9 </head>

    10 <body>

    11 <h2>ecrivez votre texte a chiffrer ou dechiffrer ici</h2>

    12 <input type="text" id="qq"><br><br>

    13 <h3>decalage</h3>

    14 <input type="text" id="x"><br><br>

    15 <input type="button" class="aa" value="chiffrer" onclick="chiffrer()">

    16 <input type="button" class="aa" value="dechiffrer"


    17 onclick="dechiffrer()"><br><br>

    18 <h3>resultat</h3>

    19 <input type="text" id="demo">

    20 <script>

    21 function chiffrer() {

    22 var
    23 lett=["a","b","c","d","e","f","g","h","i","g","K","l","m","n","o","p","q","r","s
    24 ","t","u","v","w","x","y","z"];

    25 T=document.getElementById('qq').value;

    26 n=T.length;

    14 5
    15
    16
    27 x=parseInt(document.getElementById('x').value);

    28 y=" ";

    29 for(i=0;i<n;i++){

    30 for(j=0;j<26;j++){

    31 if(T[i]==lett[j]) {

    32 if((j+x)>=26){lett[j+x]=lett[(x-(25-j))-1]; y=y+lett[j+x];}

    33 else y=y+lett[j+x];

    34 }

    35 }

    36 }

    37 document.getElementById('demo').value=y;

    38 }

    39 function dechiffrer() {

    40

    41 var
    42 lett=["a","b","c","d","e","f","g","h","i","g","K","l","m","n","o","p","q","r","s
    43 ","t","u","v","w","x","y","z"];

    44 T=document.getElementById('qq').value;

    45 n=T.length;

    46 x=parseInt(document.getElementById('x').value);

    47 y=" ";

    48 for(i=0;i<n;i++){

    49 for(j=0;j<26;j++){

    50 if(T[i]==lett[j]) {
    17 6
    18
    19
    51 if((j-x)<0){lett[j-x]=lett[26-(x-j)]; y=y+lett[j-x];}

    52 else y=y+lett[j-x];

    53 }

    54 }

    55 }

    56 document.getElementById('demo').value=y;

    57 }

    58 </script>

    59 </body>

    60 </html>

    61 CODE CSS

    62 h2 , h3{color:darkblue;}

    63 #qq{width: 10cm;

    64 height: 50px;

    65 background-color: #f8f8f8;}

    66 #x{width: 5cm;

    67 height: 20px;

    68 background-color: #f8f8f8;}

    69 #demo{width: 10cm;

    70 height: 50px;

    71 background-color: #f8f8f8;}

    72 CAPTURE

    20 7
    21
    22

    23 8
    24

    You might also like