[Erledigt] Div hover ermitteln

BlackScorp · 17.02.2011, 09:54

Hi leute,

ich möchte gerne die ID des divs ermitteln, über den sich mein mauszeiger befindet. Mein HTML Code sieht etwa so aus:

PHP-Code:

  <div class="MainDiv">
<div class="SubDiv">
   <div id="div1"></div>
   <div id="div2"></div>
   <div id="div3"></div>
   <div id="div4"></div>
   <div id="div5"></div>
   <div id="div6"></div>
   <div id="div7"></div>
</div>
</div>

Ich clone das div1 , appende es zum MainDiv und lasse ihn der maus folgen. Nun möchte ich bei dem Mousedown event ermitteln, über welchen div sich das geklonte div befindet.

Wie könnte ich am besten dabei vorgehen?

MFG

EDIT:

ein wenig Code um mal deutlich zu machen , was ich möchte:

PHP-Code:

   var dialog = $('.Dialog').offset();
        var screen =$('.MainDiv').position();
        var width = clone.width()/2;
        var height = clone.height()/2;
        var top = 0;
        var left = 0;
        var pressed = false;
        $('.MainDiv').mousemove(function(e){
            top =e.pageY-dialog.top-screen.top-height;
            left =e.pageX-dialog.left-screen.left-width;
            $('div#clone').css({
                'top':top+'px',
                'left':left+'px'
            });
            if(pressed){
               // Zeige ID des DIVs, dass sich unter dem clone befindet
            }
             
            
        }).mousedown(function(){
            pressed = true;
        }).mouseup(function(){
            pressed = false;
        });

Paul.Schramenko · 17.02.2011, 11:16

ich weiß zwar nicht genau, was du willst, aber das könnte dir helfen, nachdem was ich so verstanden habe:

Code:

$('.SubDiv').children().bind('mouseover', function(){
    alert($(this).attr('id'));
});

Paul.Schramenko · 17.02.2011, 11:17

bzw. wenn du die Divs clonst solltest du .live() verwenden, damit die Events mit geklont werden.

BlackScorp · 17.02.2011, 11:36

hat sich erledigt nun.. das was ich vorhatte, konnte ich mit selectable realisieren.. und der clone, hatte keine events, sollte einfach nur als eine art feedback angezeigt werden

BlackScorp · 17.02.2011, 19:55

Ein kleiner push.. war doch nicht so einfach mit selectable zu realisieren.. was ich quasi brauche ist eine funktion

giveDivIDatMousePos(x,y)

jedoch überlappen bei mir die divs.. wie könnte ich da am besten vorgehen?

tr0y · 18.02.2011, 01:35

Ich bin mir ( mangels Erfahrung mit Drag&Drop ) nicht sicher, aber vielleicht ist das der Schubs in die richtige Richtung für dich. Ich möchte vermuten das entweder onMouseOver oder onFocus beim "hovern" der einzelnen Divs ausgelöst wird..

rudygotya · 18.02.2011, 10:38

Wieso denn onFocus?

PHP-Code:

  $(window).mousedown(function (ev) {
  console.log(ev);
})

ev.which = >

Zitat:

The value of which will be 1 for the left button, 2 for the middle button, or 3 for the right button.

ev.target sollte dein gewünschtes div sein.

Ähnlich geht das auch mit mouseenter/mouseover, wobei auf dein obiges Beispiel das Benutzen des mousedown Events mehr sinn macht. Evtl mal die ui.mouse-Abstraktion anschauen.

grüße

Basti

BlackScorp · 18.02.2011, 10:54

Joa target ist fast, das was ich suche.

Es ist so. Ich habe ein Div, dass der Maus die Ganze zeit folgt, und es befindet sich unter der maus. Und unter diesem Div befinden sich weitere Divs , aber die überlappen sich. Wenn ich dann console.log(ev) hinschreibe, sehe ich, dass das gesuchte element sich unter folgenden Punkten befindet:

ev.originalTarget.previousElementSilbling.children

aber da werden alle children aufgelistet, ich brauche aber nur eins, das was sich gerade unter der maus befindet.

ich müsste die Irgendwie selektieren können. also
if($('div').attr('style','top') == y && $('div').attr('style','left' == x)){
alert($(this).attr('id'));
}

nur sollen die positionen eine tolranz haben, sonst müsste ich pixelgenau aufpassen wohin ich klicke..

rudygotya · 18.02.2011, 11:00

Zitat:

Ich habe ein Div, dass der Maus die Ganze zeit folgt, und es befindet sich unter der maus. Und unter diesem Div befinden sich weitere Divs , aber die überlappen sich.

Das folgt doch sicher auch irgendeiner Logik. Wieso kannst du dann nicht einfach das "aktive" div rausfiltern? Evtl hilft dir der :visible pseudo-Selektor weiter.

Wirklich verstehen, was du dort machst, tu ich allerdings nicht. Sorry.

BlackScorp · 18.02.2011, 11:25

Ok um mal nachvollziehen zu können, was ich vorhabe.

http://dev.cruel-online.de/

Dort seht ihr ein MapEditor. Wenn ihr eine Map öffnet und ein Tile auswählt, dann wird dieses ausgewählte Tile der Maus folgen, nun möchte ich bei Gedrückter maustaste das Tile in einem Div plazieren.

Vorher hatte ich das Ganze mit dem Hover effekt realisiert, aber irgendwann hatte ich das Problem, dass manche tiles nicht dort plaziert wurden, wo man es erwartet hat, weil sich die divs eben überlappen. Also nach einem klick hat das Div danaben, die hintergrund grafik erhalten.
Ich dachte mir, ich kann es lösen, wenn ich anhand meiner Mausposition , genau ermittle, welches div sich gerade unter der maus befindet. Aber das Problem hierbei ist, dass sich immer das Durchsichtige div unter der Maus befindet..

Also wie könnte ich da am besten vorgehen? Dass ich die Tiles bei gedrückter maustaste Plazieren kann. Qausi Painten

MFG

EDIT: wieso habe ich immer so komplizierte Probleme...

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
wie Ordnergröße ermitteln (filesize)	ColeThornten	PHP Einsteiger	3	10.01.2011 21:34
File modification time einer .js Datei mit js ermitteln	papalangi_44	JavaScript, Ajax und mehr	4	04.01.2011 21:09
[Erledigt] Upload: Dateigröße VOR Start des Uploads ermitteln	tobobant	JavaScript, Ajax und mehr	9	18.12.2010 20:00
Navileiste	saaja	HTML, Usability und Barrierefreiheit	11	07.12.2010 14:15
Hover nicht nebeneinander	wers1	HTML, Usability und Barrierefreiheit	11	18.08.2008 07:23
Google Adwords - echten Referer ermitteln	NetLook	PHP Tipps 2006	2	12.05.2006 08:40
Die Position ein. Datensätzes aus einer Datenliste ermitteln	Locutus007	Datenbanken	8	07.03.2006 16:59
Dateiname, Dateigröße ermitteln		HTML, Usability und Barrierefreiheit	5	29.01.2006 22:16
build nummer des bs ermitteln ... nur bei microsoft's bs!!!		PHP Tipps 2005-2	2	24.07.2005 15:59
Besucher mit den meisten GB Einträgen ermitteln!		Datenbanken	7	21.04.2005 12:09
Bildschirmauflösung ermitteln?	Pimbolie1979	HTML, Usability und Barrierefreiheit	13	16.01.2005 01:28
pixelbreite eines Wort ermitteln...	18inch	PHP Tipps 2005	5	07.01.2005 22:55
CRC Summe einer Datei ermitteln??		PHP Tipps 2004	1	14.10.2004 09:23
[Erledigt] Tabellenname eines Feldes ermitteln		PHP-Fortgeschrittene	3	22.09.2004 15:49
Referrer ermitteln?		PHP Tipps 2004	8	13.09.2004 13:43

17.02.2011, 09:54
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	[Erledigt] Div hover ermitteln Hi leute, ich möchte gerne die ID des divs ermitteln, über den sich mein mauszeiger befindet. Mein HTML Code sieht etwa so aus: PHP-Code: `<div class="MainDiv"> <div class="SubDiv"> <div id="div1"></div> <div id="div2"></div> <div id="div3"></div> <div id="div4"></div> <div id="div5"></div> <div id="div6"></div> <div id="div7"></div> </div> </div>` Ich clone das div1 , appende es zum MainDiv und lasse ihn der maus folgen. Nun möchte ich bei dem Mousedown event ermitteln, über welchen div sich das geklonte div befindet. Wie könnte ich am besten dabei vorgehen? MFG EDIT: ein wenig Code um mal deutlich zu machen , was ich möchte: PHP-Code: var dialog = $('.Dialog').offset(); var screen =$('.MainDiv').position(); var width = clone.width()/2; var height = clone.height()/2; var top = 0; var left = 0; var pressed = false; $('.MainDiv').mousemove(function(e){ top =e.pageY-dialog.top-screen.top-height; left =e.pageX-dialog.left-screen.left-width; $('div#clone').css({ 'top':top+'px', 'left':left+'px' }); if(pressed){ // Zeige ID des DIVs, dass sich unter dem clone befindet } }).mousedown(function(){ pressed = true; }).mouseup(function(){ pressed = false; }); __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen Geändert von BlackScorp (17.02.2011 um 10:40 Uhr).


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

17.02.2011, 11:16
Paul.Schramenko Erfahrener Benutzer Registriert seit: 15.04.2010 Beiträge: 813 PHP-Kenntnisse: Fortgeschritten	ich weiß zwar nicht genau, was du willst, aber das könnte dir helfen, nachdem was ich so verstanden habe: Code: $('.SubDiv').children().bind('mouseover', function(){ alert($(this).attr('id')); }); __________________ "My software never has bugs, it just develops random features." "Real programmers don't comment. If it was hard to write, it should be hard to understand!" Positive Bewertungen sind nicht unwillkommen...

17.02.2011, 11:17
Paul.Schramenko Erfahrener Benutzer Registriert seit: 15.04.2010 Beiträge: 813 PHP-Kenntnisse: Fortgeschritten	bzw. wenn du die Divs clonst solltest du .live() verwenden, damit die Events mit geklont werden. __________________ "My software never has bugs, it just develops random features." "Real programmers don't comment. If it was hard to write, it should be hard to understand!" Positive Bewertungen sind nicht unwillkommen...

17.02.2011, 11:36
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	hat sich erledigt nun.. das was ich vorhatte, konnte ich mit selectable realisieren.. und der clone, hatte keine events, sollte einfach nur als eine art feedback angezeigt werden __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

17.02.2011, 19:55
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	Ein kleiner push.. war doch nicht so einfach mit selectable zu realisieren.. was ich quasi brauche ist eine funktion giveDivIDatMousePos(x,y) jedoch überlappen bei mir die divs.. wie könnte ich da am besten vorgehen? __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

18.02.2011, 01:35
tr0y Erfahrener Benutzer Registriert seit: 26.07.2010 Beiträge: 4.865 PHP-Kenntnisse: Fortgeschritten	Ich bin mir ( mangels Erfahrung mit Drag&Drop ) nicht sicher, aber vielleicht ist das der Schubs in die richtige Richtung für dich. Ich möchte vermuten das entweder onMouseOver oder onFocus beim "hovern" der einzelnen Divs ausgelöst wird.. __________________ Lasse mir ohne Anwendung von Gewalt Dinge schenken, Amazon weiß darüber bald mehr.

18.02.2011, 10:54
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	Joa target ist fast, das was ich suche. Es ist so. Ich habe ein Div, dass der Maus die Ganze zeit folgt, und es befindet sich unter der maus. Und unter diesem Div befinden sich weitere Divs , aber die überlappen sich. Wenn ich dann console.log(ev) hinschreibe, sehe ich, dass das gesuchte element sich unter folgenden Punkten befindet: ev.originalTarget.previousElementSilbling.children aber da werden alle children aufgelistet, ich brauche aber nur eins, das was sich gerade unter der maus befindet. ich müsste die Irgendwie selektieren können. also if($('div').attr('style','top') == y && $('div').attr('style','left' == x)){ alert($(this).attr('id')); } nur sollen die positionen eine tolranz haben, sonst müsste ich pixelgenau aufpassen wohin ich klicke.. __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

18.02.2011, 11:25
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	Ok um mal nachvollziehen zu können, was ich vorhabe. http://dev.cruel-online.de/ Dort seht ihr ein MapEditor. Wenn ihr eine Map öffnet und ein Tile auswählt, dann wird dieses ausgewählte Tile der Maus folgen, nun möchte ich bei Gedrückter maustaste das Tile in einem Div plazieren. Vorher hatte ich das Ganze mit dem Hover effekt realisiert, aber irgendwann hatte ich das Problem, dass manche tiles nicht dort plaziert wurden, wo man es erwartet hat, weil sich die divs eben überlappen. Also nach einem klick hat das Div danaben, die hintergrund grafik erhalten. Ich dachte mir, ich kann es lösen, wenn ich anhand meiner Mausposition , genau ermittle, welches div sich gerade unter der maus befindet. Aber das Problem hierbei ist, dass sich immer das Durchsichtige div unter der Maus befindet.. Also wie könnte ich da am besten vorgehen? Dass ich die Tiles bei gedrückter maustaste Plazieren kann. Qausi Painten MFG EDIT: wieso habe ich immer so komplizierte Probleme... __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen Geändert von BlackScorp (18.02.2011 um 11:33 Uhr).