Postupná zmena

Flety · Napísal **Flety**: 05.12.2008 19:55

Videl som na viacerých stránkach také, že narp. po kliknutí na niečo sa zmní šírka, výška, farba, alebo iná vlastnosť, no nie takým sekom ale pene postupne, ako sa to dá spraviť? Vďaka

Tominator · Napísal **Tominator**: 05.12.2008 20:08

samozrejme

No záleží konkrétne čo presne napr ja by som to riešil cez cyklus ...

Flety · Napísal autor témy **Flety**: 06.12.2008 16:32

Nieje to trošku blbé a naokolo riešenie??? Myslím, že na to existuje aj origo funkcia a nie dokola pridávať po jednom pixly napríklad.

A čo si chcel povedať tým samozrejme?

Tominator · Napísal **Tominator**: 06.12.2008 19:23

samozrejme že sa to dá

a pokiaľ si myslíš že nejaká funkcia to nebude riešiť pixlami tak sa pravdepodobne mýliš ... pretože vysúvanie je vlastne pixlovanie a postupné zobrazenie je práva s opacity

Flety · Napísal autor témy **Flety**: 06.12.2008 20:50

Ja viem, ale určite je to menej náročné ako taký cyklus

chrono · Napísal **chrono**: 06.12.2008 22:56

Čo si predstavuješ pod pojmom "origo funkcia"?

Niektoré JS knižnice (napr. jQuery, ale aj kopec ďalších) obsahujú podobné efekty a zvyčajne sa to rieši pomocou timer-a (a postupného menenia farby, veľkosti...).

Flety · Napísal autor témy **Flety**: 06.12.2008 23:21

No tak presno to čo si tu napísal mi treba, dáš mi kód?

Tominator · Napísal **Tominator**: 07.12.2008 13:44

lol

veď ti to celý čas hovorím že vyrobíš funkciu kde na konci bude timer ktorý vyvolá tú istú funkciu

Flety · Napísal autor témy **Flety**: 07.12.2008 14:02

Tominator, bol by som rád, keby mi tu písal niekto skúsenejší a normálnejší ako ty(neberte to ako urážku užívateľa

) napríklad taký chrono by mi mohol napísať ten kód

djsulo · Napísal **djsulo**: 07.12.2008 15:07

to je skvele... ja tiez mam rad tych "programatorov" co ti tu len spamuju a vedia velke H... sorry, ale musel som to napisat.

p360t · Napísal **p360t**: 07.12.2008 17:04

Bože môj Drako, nehnevaj sa na mňa ale trochu tej vlastnej iniciatívy by si prejaviť mohol (namiesto osočovania Tominatora).

Tu je link: http://docs.jquery.com/Effects
Naozaj neviem, čo viac ešte chceš. Je tam kompletne zdokumentované API, môžeš si stiahnuť celý kód a vŕtať sa v ňom, môžeš si vyskúšať miliardu príkladov a môžeš sa na čokoľvek spýtať na ich fóre... Len to chce prekonať vlastnú lenivosť.

Flety · Napísal autor témy **Flety**: 07.12.2008 17:36

Vďaka ale akú vlastnú iniciatívu myslíš? Myslíš, si, že som neskúšal si urobiť vlastné? alebo hľadať? Len som nevedel tie správne slová

p360t · Napísal **p360t**: 08.12.2008 6:52

Hm, žeby 6. príspevok v tejto téme?

Flety · Napísal autor témy **Flety**: 12.12.2008 21:46

No, lenže keď JS neovláadam tak si kód asi nenapíšem, že

rooobertek · Napísal **rooobertek**: 12.12.2008 22:33

stačí set_timeout alebo set_interval

Flety · Napísal autor témy **Flety**: 12.12.2008 23:02

Použijem to jquery

dik p360t

chrono · Napísal **chrono**: 14.12.2008 2:30

Drako píše:

...

Aj som zabudol, že som sem niekedy písal.

Každopádne odporúčam ti, aby si sa pozrel na tú knižnicu jQuery (prípadne inú, ale jQuery teraz "letí"). Rôzne efekty sa tam riešia pomerne jednoducho aj pre človeka, čo nie je špecialista na javascript (a nemusíš príliš riešiť to, či to bude fungovať v každom normálnejšiom prehliadači).
Napr. obľúbené vysúvacie menu sa dá, pomocou jQuery, naprogramovať na pár riadkoch:

Kód:

http://www.i-marco.nl/weblog/jquery-accordion-menu/

(a je použiteľné aj bez zapnutého javascriptu)

Flety · Napísal autor témy **Flety**: 14.12.2008 12:21

Ten jQuery sa mi strašne páči a už som ho aj začlenil do niektorých (práve vyvíjaných) stránok ale to, že to funguje aj bez zapnutého JS nie je pravda

ale je to naozaj jednoduché na použitie a dobre sa dajú kombinovať funkcie.

Flety · Napísal autor témy **Flety**: 14.12.2008 16:19

Dá sa cez ten jQuery spraviť tak, že po ukázaní na obrázok mi na koniec názvu súboru (pre príponu) napíše nejaký string? Teda normálne bude kód <img src="obrazok.png"> a po ukázaní bude <img src="obrazok-string.png"> Dá sa tak?

Tominator · Napísal **Tominator**: 14.12.2008 18:36

necháoem zmysel ...

Flety · Napísal autor témy **Flety**: 15.12.2008 16:10

Frontpage robí takýmto skriptom hover tlačidla... Ja chcem tiež meniť obrázok. Viem, že sa vám to nepáči, že to budem robiť takto... ale k tomu sa prosím nevyjadrujte

Tak dá sa to?

Tominator · Napísal **Tominator**: 15.12.2008 17:36

Ale čo vlastne chceš??

Flety · Napísal autor témy **Flety**: 15.12.2008 21:15

Buď si hlúpy(a to ma napadlo už druhý krát) alebo nevieš čítať... prečítaj si príspevky vyššie, čo vlastne chcem. Ale už som to aj tak poriešil inak.

chrono · Napísal **chrono**: 17.12.2008 16:16

Drako píše:

... ale to, že to funguje aj bez zapnutého JS nie je pravda...

Ty musíš urobiť stránku tak, aby fungovala aj bez Javascriptu. Potom to pomocou javascriptu len vylepšíš (teda, žiadne onclick=""; href="#"...)

Tominator · Napísal **Tominator**: 17.12.2008 17:00

Drako píše:

Buď si hlúpy(a to ma napadlo už druhý krát) alebo nevieš čítať... prečítaj si príspevky vyššie, čo vlastne chcem. Ale už som to aj tak poriešil inak.

chceš zmeniť obrázok, prepísať adresu, prepísať title, prepísať alt??

proste kvantum možností a popis nestačí:

Citácia:

Dá sa cez ten jQuery spraviť tak, že po ukázaní na obrázok mi na koniec názvu súboru (pre príponu) napíše nejaký string? Teda normálne bude kód <img src="obrazok.png"> a po ukázaní bude <img src="obrazok-string.png"> Dá sa tak?

chrono · Napísal **chrono**: 17.12.2008 17:36

Drako píše:

Dá sa cez ten jQuery spraviť tak, že po ukázaní na obrázok mi na koniec názvu súboru (pre príponu) napíše nejaký string? Teda normálne bude kód <img src="obrazok.png"> a po ukázaní bude <img src="obrazok-string.png"> Dá sa tak?

Môžeš použiť funkciu hover a ako parametre použiješ dve funkcie. V nich budeš (pravdepodobne) musieť použiť nejaké regexp, aby si zistil, aké sú tie názvy súborov a potom ich prípadne upravíš. Použiť teda môžeš niečo takéto (ale samozrejme lepšie urobené

)

Kód:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
   <title>untitled</title>
   <meta http-equiv="content-type" content="text/html;charset=utf-8" />
   <meta name="generator" content="Geany 0.16" />
   <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
   <script type="text/javascript">
      $(function(){
         $("img.h").hover(function(){
            var re = new RegExp("^(.*/)([^/]+)(\.gif|\.jpg|\.png)$", "i");
            var m = re.exec(this.src);
            if (m && !m[2].match(/-string$/)) {
               this.src = m[1] + m[2] + '-string' + m[3];
            }
         }, function(){
            var re = new RegExp("^(.*/)([^/]+)-string(\.gif|\.jpg|\.png)$", "i");
            var m = re.exec(this.src);
            if (m) {
               this.src = m[1] + m[2] + m[3];
            }
         });
      });
   </script>
</head>

<body>
   <div>
      <img class="h" width="240" height="64" src="a.png">
      <img class="h" src="b.jpg">
   </div>
</body>
</html>

PS: Ani nebudem komentovať ten šialený spôsob tvorenia hover efektu pomocou zmeny src atribútu.

rooobertek · Napísal **rooobertek**: 17.12.2008 22:29

Pre doplnenie, keď už chcete spraviť odkaz, ktorý nikam nevedie, iba robí nejaký javascript, tak dávajte javascript:void(0) namiesto #

chrono · Napísal **chrono**: 18.12.2008 0:23

javascript:void(0) je rovnako zlé ako #

Každý link má odkazovať na nejakú reálnu adresu (to pre prípad, že je javascript zakázaný). Ak je javascript povolený, pridá sa tomu linku obsluha pre kliknutie a tam sa potom vráti false (a teda sa stránka nikam nepresmeruje). Ak sa tam nedá použiť link s normálnou adresou (a teda bez JS nefunguje), tak sa tam ten link môže vložiť pomocou javascriptu (a teda tam bude len vtedy, keď bude fungovať).

Robiť stránky, ktoré fungujú aj pri zakázanom JS je zložitejšie, ale ak má byť stránka kvalitná, tak by mala byť urobená dobre.

rooobertek · Napísal **rooobertek**: 18.12.2008 8:51

Mne o tom niečo hovor. Ja sám mám pri browsovaní javascript vypnutý, ale šéf akosi bazíruje na všetom, čo sa len ošuchlo okolo ajaxu (mám pocit, že ani nevie, čo ja ajax a čo javascript), ako keby to bolo nejaké zázračné slovíčko, ktoré dokáže vyriešiť všetky problémy na svete.
Ale keď už, tak radšej javascript:void(0) ako #, pretože javascript:void(0) dokáže ako jediné zaručiť, že sa stránka nerefreshne. Ja to používam tak, že mám všetky linky normálne a pri loadnutí stránky sa mi javascriptom prepíšu linky, ktoré potrebujem, na javascript:void(0) a pridám im addEventListener onclick. Čiže aj vlk je sýty, aj koza je celá. Ale keby bolo po mojom, vy :shit:

sa ja na celý javascript. Cez javascript by som robil len nejaké somarinky a efektíky, nie všetko. Navyše, v Pravidlách tvorby prístupných webových stránok je spomenuté aj to, že tvorca stránky nemôže predpokladať, že užívateľ má monitor, že používa štýly, že používa obrázky, ani že používa javascript.

max-m · Napísal **max-m**: 18.12.2008 9:12

rooobertek píše:

Ja to používam tak, že mám všetky linky normálne a pri loadnutí stránky sa mi javascriptom prepíšu linky, ktoré potrebujem, na javascript:void(0) a pridám im addEventListener onclick.

ja som v JavaScripte uplny zaciatocnik (mozno ani to nie

) a rad by som na mojich strankach poriesil "ochranu" proti vypnutemu JS podobne ako ty. ako to vsak robis? nejaky jednoduchy priklad? (ja by som potreboval nie onclick ale onmouseover).

DIK.

Postupná zmena

Podobné témy