Forum PHP.pl > warstwa obok kursora

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

MitS

20.02.2007, 17:43:45

witam!

Szukam porady / źródeł / tutoriali itp. jak zrobić taki patent by po kliknięciu na link wyświetliła by mi sie warstwa (div) obok kursora ale by się nie przemieszczała razem z nim ... dodatkowo do javascript musze pobierać znaczniki po klasie (a nie po ID lub NAME)...

MAcie jakieś pomysły

revyag

20.02.2007, 19:34:02

Jak to musisz pobierać "do javascript" ? Niby skąd pobierać ? Powinieneś napisać chyba że uzyskiwać dostęp do elementów przy pomocy nazwy klasy. To akurat łatwe, na googlach można sporo znaleźć.
getElementByClassName
a jeśli chodzi o pierwsze pytanie, to tu masz odpowiedź:
http://forum.php.pl/index.php?showtopic=34...amp;hl=position

MitS

20.02.2007, 21:04:30

Hmmm na ID niby działa ale gdy zamiast ID podstawie klase tak jak wyżej napisałeś to niestety ten kod nie działą

Kod

<html>
<head>
<script type="text/javascript">
function pos() {
   if (window.Event) {
       document.captureEvents(Event.MOUSEMOVE);
   }
   document.getElementByClassName("test").onmousemove = function(e){
       x = (window.Event) ? e.pageX : event.clientX;
       y = (window.Event) ? e.pageY : event.clientY;
       document.getElementByClassName("head").style.left=x - 5;
       document.getElementByClassName("head").style.top=y - 15;
       document.getElementByClassName("head").style.display="block";
       document.getElementByClassName("w").innerHTML="mouseX:"+x+"<br />mouseY:"+y;
   }
   document.getElementByClassName("test").onmouseout=function() {
       document.getElementByClassName("head").style.display="none";
   }
}
window.onload = pos;
</script>
<style type="text/css">
div.head {
   width:50px;
   height:10px;
   background-color:red;
   position:absolute;
   display:none;
   z-index:1;
}
div.test {
   width:200px;
   height:100px;
   position:absolute;
   left:100px;
   top:300px;
   background-color:blue;
   z-index:0;
}
</style>
</head>
<body>
<div class="head"></div>
<span class="w"></span>
<div class="test">

</div>
</body>
</html>

czemu nie działą właśność getElementByClassName

revyag

20.02.2007, 22:06:25

Ale chyba masz tą funkcję gdzieś napisaną co ? W javascript nie ma czegoś takiego. Znajdź sobie na googlach jakąś interpretację.

MitS

20.02.2007, 23:16:24

Tzn samą funkcje mam... jest taka:

[PHP] pobierz, plaintext 
<?php
function getElementsByClassName(clsName) 
{ 
var arr = new Array(); 
var elems = document.getElementsByTagName("*");
 
for ( var cls, i = 0; ( elem = elems[i] ); i++ )
{
	if ( elem.className == clsName )
		{
		arr[arr.length] = elem;
	}
}
return arr;
}
?>
[PHP] pobierz, plaintext

ale to coś w tym kodzie co poprzednio podałem nie działa ... (sama funkcja jest dobra).
Pozdrawiam

----------
Prosze pamietac o bbcode
--
dr_bonzo

Joy-machine

20.02.2007, 23:59:31

1. Znajdź inną funkcję getElementByClassName - najlepiej wersję z wyrażeniem regularnym i 3 parametrami - jest sprawdzona. Ta Twoja jest niezbyt wydajna.
2. Stosujesz parę razy "document.getElementByClassName("head")" - i pomijając fakt, że takie jej uzycie nie istnieje, to kompletnie źle używasz wyniku działania takich funkcji - to tak jakbyś wyjmował sztućce z szuflady pojedynczo i za każdym razem otwierał i zamykał szufladę. Plus to że Twoja funkcja jest mało wydajna (bo przelatuje pętlą po wszystkich obiektach na stronie!!!) to jeszcze ją wywołujesz parę razy pod rząd.
Np wynik (czyli obiekt) funkcji document.getElementById('xxx') zapisuj do zmiennej np "obj" o potem już tylko obj.style.xxx....
3. poza tym ok.

MitS

21.02.2007, 08:00:04

ok dzieki za informacje

Dziś spróbuje coś napisac i jak by były problemy to sie odezwe

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.