Obsah fóra
PravidláRegistrovaťPrihlásenie




Odpovedať na tému [ Príspevkov: 2 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
jednoduchy onclick animation

Registrovaný: 07.08.06
Prihlásený: 18.11.21
Príspevky: 947
Témy: 268
Bydlisko: Levice
Príspevok NapísalOffline : 20.09.2017 22:24

Na obrazovke budem mat nahodne umiestneny maly obrazok (nahodna pozicia, cize nie vzdy na tom istom mieste).

Chcem, aby sa po kliknuti na ten obrazok tento obrazok presunul vzdy na jednu poziciu, v mojom pripade top: 65px, left:400px.

Skusal som toto:

Kód:
var relX = ev.pageX - $('#div1').offset().left;
var relY = ev.pageY - $('#div1').offset().top;

$('#div1').append('<div style="top:'+relY+'px; left:'+relX+'px; position:absolute; display:none;" class="nieco">obrazok</div>');
//$('#div'+cid).remove();
$('.nieco').show();
$('.nieco').animate({ "top": "-="+(ev.pageY-65)+'px', "left": "400px", opacity: 100 }, 1500, function()
{

});


Funguje mi to, ze to presunie hore na top:65, kedze tam pocitam polohu obrazka minus 65px, cize kdekolvek bude obrazok, tak sa presunie hore na tu poziciu.

Problem je s horizontalnym posunom, kedze neviem ci bude obrazok vlavo ci vpravo, neviem mu zadat ci ma ist vlavo ci vpravo, a nechcem zbytocne davat nejake podmienky, ze kde je obrazok tak podla toho urci smer atd.

neexistuje taka metoda, ze by som len zadal suradnice (absolute position na celej obrazovke) a ze by sa po kliku ten obrazok presunul presne na to miesto? Cize nie relativne od obrazka, ale presne definovane suradnice.

Druha vec je, ze hned po kliku aby zmizol ten obrazok z povodneho miesta, a po ukonceni animacie sa objavi na tej finalnej pozicii. To sa aj objavi, len nezmizne z povodneho miesta, cize zostane aj tam, hoci animacia prebehne.

Ked dam
Kód:
$('#div1').remove();
tak zmizne aj animacia, kedze tam je append k tomu divu.

Viete poradit?

// Spojený príspevok Štv 21.09.17 8:39

o,, tak som predsa len pouzil podmienky

Kód:
 var aa = $('#div1').offset().top;
        var bb = $('#div1').offset().left;

        var pos = 300;

        if (bb <= pos) {
            var move = (pos - bb);
            var left = "+" + move + "px";
        } else {
            var move = (bb - pos);
            var left = "-=" + move + "px";
        }


a potom v animate funkcii len pouzijem premennu left a funguje to, presunie sa to na presne urcene miesto, nech je ten obrazok kdekolvek.

Problem este mam s tym, ze by sa hned ten div po kliku skryl na povodnom mieste a bol by viditelny len pri animacii

// Spojený príspevok Štv 21.09.17 9:05

takze nakoniec som zrusil append, a animujem len hlavny div po kliknuti. Tym padom nepotrebujem pocitat poziciu ani podmienky, len definujem do animate funkcie napevno "top": '20px', "left": '300px', a po kliku to animuje presne na to miesto a navyse obrazok nezostane na povodnom mieste ale sa presuva.

Niekedy na to clovek pride skor sam :)


Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 06.02.14
Prihlásený: 19.01.18
Príspevky: 443
Témy: 9
Príspevok NapísalOffline : 22.09.2017 11:24

vidim, ze si to vyriesil, len by som ti poradil: oddel javascript a style. nemiesaj to dokopy, css nema byt preco v javascripte (ak to naozaj nie je potrebne)
vsetko css presun do suboru css a v javascripte to ovladaj cez zmenu triedy. bude to ovela prehladnejsie


Odpovedať na tému [ Príspevkov: 2 ] 


Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy. Free 2D animation software

v Ostatné programy

1

950

21.09.2009 21:43

Tech Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick

v JavaScript, VBScript, Ajax

3

559

07.10.2010 0:40

camo Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Opera onclick

v JavaScript, VBScript, Ajax

8

467

05.05.2010 17:57

camo Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick + jquery

v JavaScript, VBScript, Ajax

0

437

12.03.2010 13:31

neopagan Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick unlink php

v PHP, ASP

7

1161

13.01.2010 22:58

pilná lama glama Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick window open

v JavaScript, VBScript, Ajax

1

451

19.08.2010 18:52

chrono Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick v innerHTML

v JavaScript, VBScript, Ajax

4

845

15.06.2009 8:30

zaciatocnik Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. dynamické menenie udalosti onclick

v JavaScript, VBScript, Ajax

5

882

13.06.2008 22:47

emer Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. href na div a onclick

v HTML, XHTML, XML, CSS

4

580

13.09.2011 21:31

vputin Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. innerHTML onclick function ... prosím pomoc

v JavaScript, VBScript, Ajax

3

670

07.08.2009 19:42

Ďuri Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. onclick posun textu a fade out

v JavaScript, VBScript, Ajax

5

670

20.02.2015 7:56

neopagan Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Dva onclick v jednom a href?

v HTML, XHTML, XML, CSS

1

510

03.01.2010 17:32

Ďuri Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. jednoduchy anitispam

v PHP, ASP

1

557

22.11.2009 7:51

stenley Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Jednoduchy PC

v PC zostavy

18

723

13.07.2016 7:29

Ivan-K Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Jednoduchy Search

v PHP, ASP

6

753

10.05.2009 13:29

jtomcik Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Jednoduchy script

v JavaScript, VBScript, Ajax

10

857

18.12.2008 15:32

Draex Zobrazenie posledných príspevkov


Nemôžete zakladať nové témy v tomto fóre
Nemôžete odpovedať na témy v tomto fóre
Nemôžete upravovať svoje príspevky v tomto fóre
Nemôžete mazať svoje príspevky v tomto fóre

Skočiť na:  

Powered by phpBB Jarvis © 2005 - 2024 PCforum, webhosting by WebSupport, secured by GeoTrust, edited by JanoF
Ako väčšina webových stránok aj my používame cookies. Zotrvaním na webovej stránke súhlasíte, že ich môžeme používať.
Všeobecné podmienky, spracovanie osobných údajov a pravidlá fóra