Mam małą zagwózdkę jak zrobić w JS aby po zdarzeniu onClick pojawiła mi się tuż koło kursora albo lista wyboru albo lista linków z której mogę wybrać jakąś wartość ( i np zatwierdzić ją onChange - zapisać wartość jakiejś zmiennej w JS i schować okienko ).
Nie wydaje mi się, żeby można było zrobić to ukrytym dive'em. Chodzi mi o efekt, który można zobaczyć w przeglądzie galaktyki w Ogame.pl.
Po najechaniu kursorem na planetę pokazuje mi się menu. Chciałbym takie coś uzyskać, ale na onClick. W kodzie źródłowym od ogame.pl skopiowany kod nie daje rezultatu, ani też nie pokazują się błędy w przypadku brakujących funkcji.
Hmmm
"Nie wydaje mi się, żeby można było zrobić to ukrytym dive'em." - a jak to robi kod, który skopiowałeś?
"Nie wydaje mi się, żeby można było zrobić to ukrytym dive'em." - a jak to robi kod, który skopiowałeś?
To jest fragment kodu. Jest tam tabelka gdzie są ikonki planet. Po najechaniu na ikonke pokazuje się taka o tabelka:
Ja wykombinowałem takie coś. Po kliknięciu na lista7 wyskakuje ci menu z diva id="menu"
Kod
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl">
<head>
<script type="text/javascript">
function doKursora (e) {
var posx, posy;
if (window.event) {
posx = window.event.offsetX;
posy = window.event.offsetY;
} else {
posx = e.pageX;
posy = e.pageY;
}
if (navigator.userAgent.indexOf ("Opera") != -1) {
posx = e.clientX + document.body.scrollLeft;
posy = e.clientY + document.body.scrollTop;
}
with (document.getElementById("menu").style) {
display = "block";
left = (posx + 5) + "px";
top = (posy + 5) + "px";
}
}
</script>
<style type="text/css">
li a {
color: red;
}
#menu {
position: absolute;
display: none;
left: 0px;
top: 0px;
}
#menu a {
display: block;
background-color: #eeeeee;
}
</style>
</head>
<body>
<div>
<ul>
<li>Lista 1</li>
<li>Lista 2</li>
<li>Lista 3</li>
<li>Lista 4</li>
<li>Lista 5</li>
<li>Lista 6</li>
<li><a onclick="doKursora (event);">Lista 7</a></li>
<li>Lista 8</li>
</ul>
</div>
<div id="menu">
<a href="1">Link1</a>
<a href="2">Link2</a>
<a href="3">Link3</a>
</div>
</body>
</html>
<head>
<script type="text/javascript">
function doKursora (e) {
var posx, posy;
if (window.event) {
posx = window.event.offsetX;
posy = window.event.offsetY;
} else {
posx = e.pageX;
posy = e.pageY;
}
if (navigator.userAgent.indexOf ("Opera") != -1) {
posx = e.clientX + document.body.scrollLeft;
posy = e.clientY + document.body.scrollTop;
}
with (document.getElementById("menu").style) {
display = "block";
left = (posx + 5) + "px";
top = (posy + 5) + "px";
}
}
</script>
<style type="text/css">
li a {
color: red;
}
#menu {
position: absolute;
display: none;
left: 0px;
top: 0px;
}
#menu a {
display: block;
background-color: #eeeeee;
}
</style>
</head>
<body>
<div>
<ul>
<li>Lista 1</li>
<li>Lista 2</li>
<li>Lista 3</li>
<li>Lista 4</li>
<li>Lista 5</li>
<li>Lista 6</li>
<li><a onclick="doKursora (event);">Lista 7</a></li>
<li>Lista 8</li>
</ul>
</div>
<div id="menu">
<a href="1">Link1</a>
<a href="2">Link2</a>
<a href="3">Link3</a>
</div>
</body>
</html>
Oto mi banglało 
Nie zdawałem sobie sprawy, że można to jednak na div'ach zrobić tak miło i przyjemnie.
Dzięki wielkie.
Nie zdawałem sobie sprawy, że można to jednak na div'ach zrobić tak miło i przyjemnie.
Dzięki wielkie.
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.