Curs Javascript

Scriptul prezentat in aceasta pagina afiseaza in acelasi loc cate o imagine cu link propriu spre o anumita pagina, care se poate schimba dintr-o caseta Select ce contine mai multe imagini.
Puteti testa scriptul in exemplul de mai jos.


Pentru a adauga acest script intr-o pagina web:
1. Introduceti in sectiunea HEAD a documentul HTML, urmatorul script:
<script type="text/javascript">
<!--
// https://marplo.net

// Functia pt. link-uri care sunt in aceeasi ordine cu imaginile
function linkuri(imagine) {
  var adrURL=new Array()
  // Aici adaugati adresele URL care vor fi deschise la
  // click pe fiecare imagine,
  // Pentru adaugarea mai multor adrese, respectati ordinea indicelui din matrice
  adrURL[0]="https://marplo.net/anime/naruto-a"
  adrURL[1]="https://marplo.net/anime/naruto-a"
  adrURL[2]="https://marplo.net/anime/naruto-a"
  adrURL[3]="https://marplo.net/anime/dragon_ball_z-a"

  // Deschide pagina cu URL-ul selectat
  window.location=adrURL[imagine]
}

// Functia care schimba imaginea
function showimage() {
  if (!document.images)
    return
  document.images.pozas.src=
  document.mypics.poza.options[document.mypics.poza.selectedIndex].value
}
//-->
</script>

2. Dupa tagul <body>, in locatia unde vreti sa apara caseta de selectare impreuna cu imaginile, adaugati urmatorul cod:
<div>
  <form name="mypics" style="margin:4px;">
    <select name="poza" size="1" onChange="showimage()">
      <option select="selected" value="imgs/img1.jpg">Naruto</option>
      <option value="imgs/img2.jpg">Sasuke</option>
      <option value="imgs/img3.jpg">Sakura</option>
      <option value="imgs/img4.jpg">Son Goku</option>
    </select>
  </form>
  <a href="javascript:linkuri(document.mypics.poza.selectedIndex)" onMouseover="window.status='';return true">
    <img src="imgs/img1.jpg" name="pozas" width="100" height="100" border="0">
  </a>
</div>
- Efectuati modificarile necesare, conform cu imaginile folosite de dv.
- Pentru ca fiecare link sa corespunda cu imaginea specifica lui, adaugati in script, in functia "linkuri()", adresele URL in aceasi ordine cu imaginile corespunzatoare adaugate in caseta de selectare.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut e folosit in tag-ul <img> pentru adresa imaginii?
href src rel
<img src="http://coursesweb.net/imgs/webcourses.gif" width="191" height="63" alt="Courses-Web" />
Care din aceste coduri CSS ascunde elementul in pagina?
display: none; display: inline; position: relative;
#id {
  display: none;
}
Ce instructiune opreste executia lui while() sau for() ?
continue prompt() break
for(var i = 0; i< 8; i++) {
  if(i > 1) break;
  alert(i);
}
Indicati functia utilizata pentru a crea constante.
define() include() defined()
define("CONSTANT_NAME", "value");
echo CONSTANT_NAME;
Care este forma de plural a substativului "class" (clasa)?
classes clases clasis
This school has three classes.
- Scoala asta are trei clase.
Care este pluralul substativului "voz" (voce)?
vose voze voces
Escuché dos voces.
- Am auzit doua voci.
Schimbare imagine din select

Last accessed pages

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (272409)
  2. Oaia cu mielul, pilda de viata intr-o poveste (540)
  3. Sintaxa JavaScript (11145)
  4. Verbe - Exercitii si teste engleza incepatori (26697)
  5. Pensula si Radiera (1010)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1206)
  2. Coduri pt culori (574)
  3. Cursuri limba engleza gratuite si lectii online (487)
  4. Gramatica limbii engleze - Prezentare Generala (480)
  5. Exercitii engleza - English Tests and exercises - Grammar (441)