2017

SlideShow simplu cu Javascript



Cu ajutorul unui cod script realizat de Vku poti adauga un slideshow cu imagini ce se schimba la un anumit interval de timp.

Pentru utilizare mergi la Desing --> Adaugati un obiect gadget --> HTML/Javascript si aici adaugi urmatorul script:
<div id="cambiaimg-vku" style="text-align: center;"></div>
<script type="text/javascript">
//<![CDATA[
var cont = 0;
var arr = [
["http://www.trilulilu.ro/muzica","http://2.bp.blogspot.com/-YeBpBtX6Jiw/TZhbueRGAuI/AAAAAAAAClw/dvDxqz2-aIY/s400/trilulilu.ro%2B2011-4-3%2B13-28-23.png"],
["http://www.trust-community.com/costan","http://2.bp.blogspot.com/-NkSXKsnyCDA/TZhcciNxOGI/AAAAAAAACl4/rMSrS158fTs/s400/www.trust-community.com%2B2011-4-3%2B13-29-10.png"],
["http://nouwidget.blogspot.com/","http://1.bp.blogspot.com/-uQS5xXysU-0/TZhc8FHOWwI/AAAAAAAACmA/UAUkrhDGxpQ/s400/nouwidget.blogspot.com%2B2011-4-3%2B13-26-53.png"],

]
function cambiaimg_vku() {
var d = document.getElementById("cambiaimg-vku");
cont = cont % arr.length;
d.innerHTML = "<a href='"+arr[cont][0]+"' target='_blank'><img border=0 src='"+arr[cont][1]+"'></a>";
cont++;
}
function inicioimg_vku() {
cambiaimg_vku();
setInterval(cambiaimg_vku, 3000);
}
window.onload=inicioimg_vku;
//]]>
</script>
Schimba adresele de link (culoare albastra)
Inlocuieste url imaginilor (culoare rosie) cu imagini ce doresti sa apara in slideshow.
Daca vrei sa modifici viteza de schimb 3000 a imaginilor schimba numarul cu unul superior sau inferior.

Daca vrei sa apara mai multe imagini in slideshow adauga ori de cate ori ai nevoie urmatoarea linie de cod:
["http://nouwidget.blogspot.com/","http://1.bp.blogspot.com/-uQS5xXysU-0/TZhc8FHOWwI/AAAAAAAACmA/UAUkrhDGxpQ/s400/nouwidget.blogspot.com%2B2011-4-3%2B13-26-53.png"],
Un exemplu de SlideShow gasesti aici...

15 comentarios:

  1. E foarte misto! Dar e ceva de lucru la el! Si acum o intrebare "blonda" : Se poate face si mai mare de atat? :)

    RăspundețiȘtergere
  2. Buna Claudia nu am inteles intrebarea! la ce te referi? "Se poate face si mai mare de atat?"

    RăspundețiȘtergere
  3. Da, adica alta dimensiune! Ca un patrat, de exemplu! Ca, sunt blonda pana la capat, ieri am incercat sa-l fac, dar nu mi-a iesit! Si daca nici tu nu dai indicatii explicite....nu mai da nimeni.
    Ultimul script il bagi dupa fiecare pagina+poza?

    RăspundețiȘtergere
  4. Salut Claudia , alte dimensiuni sau forme sigur que se pot face dar fara modificari la script tu trebuie sa alegi de exemplu 3 imagini cu aceasi dimensiune 200x200 si ai o prezentare in forma de patrat, acum daca intrebarea ta se refera la aceasta linie:

    ["http://nouwidget.blogspot.com/","http://1.bp.blogspot.com/-uQS5xXysU-0/TZhc8FHOWwI/AAAAAAAACmA/UAUkrhDGxpQ/s400/nouwidget.blogspot.com%2B2011-4-3%2B13-26-53.png"],

    o adugi in continuarea celei de a treia lini din codul de mai sus asa apare inca o imagine in plus la SlideShow.

    RăspundețiȘtergere
  5. Multam mult! Astept cu nerabdare sa-mi recomanzi un firewall k-lumea! Link-urile de aici nu mai sunt active!

    RăspundețiȘtergere
  6. Salut Claudia aici gasesti un antivirus modern cu o foarte buna protectie, il descarci si ai o luna de proba gratis dar il poti prelungi inca 12 luni daca te inregistrezi la ei.

    http://nouwidget.blogspot.com/2011/03/antivirus-gratis-ultima-versiune-avg.html

    RăspundețiȘtergere
  7. Ma bucur tare mult ca te-a ajutat Claudia.

    RăspundețiȘtergere
  8. Buna seara...foarte util site-ul d-voastra, am renuntat la slideshow-ul oferit de Picasa in favoarea acestuia...acesta din urma are marele avantaj ca este continuu si are link-uri si in spatele imaginilor...slideshow-ul adaptat de noi se poate vedea pe http://www.autovital.ro...va trebui sa mai lucram la el, dar este un inceput...va multumim pentru nenumaratele articole folositoare si va felicitam pentru site...o seara buna!

    RăspundețiȘtergere
  9. Multumesc Autovtal pentru aprecieri si iti doresc SUCCES! in continuare.

    RăspundețiȘtergere
  10. Buna, am si eu o intrebare. Cum modific dimensiunea imaginilor in acest scrpit ca sa nu modific fiecare imagine in parte?Multumesc.

    RăspundețiȘtergere
  11. foarte folositor....multumesc mult

    RăspundețiȘtergere
  12. Am si eu aceeasi intrebare ca Ana-Maria Bizu...
    - cum stabilesc o dimensiune standard pt toate pozele in script ?
    si inca una:
    - cum pun un mesaj/titlu pt fiecare poza ?
    Sper ca nu este prea greu. Asa va fi un script universal.

    RăspundețiȘtergere
  13. Am gasit !!!
    http://www.dynamicdrive.com/dynamicindex14/flexislide.htm
    Un slideshow in care nu trebuie sa modifici imaginile si poti pune text/comentariu la fiecare poza ...
    Mai trebuie modificat un pic la dimensiuni, dar in rest merge.
    ADICA:
    Se pune height="200" width="200" dupa vspace="3" si se sterge width:'+slidewidth+';height:'+slideheight+';

    RăspundețiȘtergere

Bine ai venit!
In continuare poti lasa mesajul tau.

Multumesc