Změna kurzoru v canvasu – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Změna kurzoru v canvasu – JavaScript, AJAX, jQuery – Fórum – Programujte.comZměna kurzoru v canvasu – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Toto vlákno bylo označeno za vyřešené — příspěvek s řešením.
Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
Nefaritus
~ Redaktor
+2
Posthunter
12. 3. 2013   #1
-
0
-

Ahoj,

mám canvas a v něm vykreslené obdélníky (ne výšku přes celý canvas, na šířku už ne). Když na obdélník najedu, má se kurzor změnit na pointer, když najedu na horizontální kraje obdélníku, má se kurzor změnit na col-resize. Řeším to následujícím kódem (uvnitř události 'onmousemove' na canvasu).

for (var i = 0; i < myState.stripes.length; i++) {
  var stripe = myState.stripes[i];
  if (stripe.contains(mouse.x, mouse.y)) {
    if((mouse.x > stripe.offset) && (mouse.x < stripe.offset + 6)) {
      $('body').css('cursor','col-resize');
    } else if((mouse.x < (stripe.offset + stripe.width)) && (mouse.x > (stripe.offset + stripe.width - 6))) {
      $('body').css('cursor','col-resize');
    } else {
      $('body').css('cursor','pointer');
    }
  } else {
    $('body').css('cursor','default');
  }
}

Problém je ten, že ty kurzory se mění pouze na obdélníku, který je v poli (myState.stripes) poslední a na ostatních to nefunguje. Zkoušel jsem i vypisovat nějaký text po najetí na obdélník a to už fungovalo na všech, ale kurzor pořád jen na tom posledním. Nevidíte někdo, kde by mohl být problém? Díky.

Nahlásit jako SPAM
IP: 194.228.11.–
Reklama
Reklama
peter
~ Anonymní uživatel
2539 příspěvků
13. 3. 2013   #2
-
0
-

To by chtelo asi funkcni priklad. $('body') je nastaveni pro body tag, ne? Nejaky obdelnicek v canvasu by to nemelo resit.

Ja bych to resil tak, ze canvas bych pouzil jako graficke pozadi a pres to naplacal divy.

Nahlásit jako SPAM
IP: 2001:718:2601:400:0:5efe:...–
Nefaritus
~ Redaktor
+2
Posthunter
13. 3. 2013   #3
-
0
-

#2 peter
To je jedno pro který element to použiješ, i když to dám vyloženě jen na canvas, tak je výsledek stejný. A to řešení funguje, ale jen na posledním objektu v poli, na těch ostatních ne, to mi vrtá hlavou proč.

Nahlásit jako SPAM
IP: 194.228.11.–
peter
~ Anonymní uživatel
2539 příspěvků
13. 3. 2013   #4
-
0
-

Ja bych ti rad poradil, ale bez spustitelneho kodu se mi vlastni vytvaret nechce. U jquery se pouziva each() pro prochazeni vsech prvku a pro zmenu vlastnosti bych pouzil zmenu className (js).

Nahlásit jako SPAM
IP: 2001:718:2601:400:0:5efe:...–
Řešení
Nefaritus
~ Redaktor
+2
Posthunter
3. 5. 2013   #5
-
0
-
Vyřešeno Nejlepší odpověď

Bylo by od mě hezké poslat řešení, když už jsem to vyřešil :D Takže jde o to, že je potřeba ten cyklus breakovat a pak to jde v pohodě.

for (var i = 0; i < myState.stripes.length; i++) {
  var stripe = myState.stripes[i];
  if (stripe.contains(mouse.x, mouse.y)) {
    if((mouse.x > stripe.offset) && (mouse.x < stripe.offset + 6)) {
      $('body').css('cursor','col-resize'); break;
    } else if((mouse.x < (stripe.offset + stripe.width)) && (mouse.x > (stripe.offset + stripe.width - 6))) {
      $('body').css('cursor','col-resize'); break;
    } else {
      $('body').css('cursor','pointer'); break;
    }
  } else {
    $('body').css('cursor','default'); break;
  }
}
Nahlásit jako SPAM
IP: 212.4.138.–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 6 hostů

Podobná vlákna

Zmena kurzoru — založil giro

Změna kurzoru — založil Pavel Synek

Změna kurzoru - vygenerování — založil MpPozor

Zmena polohy kurzoru myši — založil lukas.balaz

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý