Forum PHP.pl > [JavaScript][jquery] pytanie jak zapisać link w javascript zeby mozna było kliknąć

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript][jquery] pytanie jak zapisać link w javascript zeby mozna było kliknąć

lamcpp

2.12.2009, 13:18:44

witam, chciałem wykorzystać bibliotekę jquery w swojej galerii zdjeć do akcji pokazywania bądz ukrywania linków "następny" i "poprzedni" w przypadku gdy użytkownik najedzie na zdjęcie bądź też nie (czyli cos takiego jak w lightboxie).
Odpowiedni skrypt zaciągnałem stąd:
http://docs.jquery.com/Events/mouseover#fn
Wygląda on tak:

[HTML] pobierz, plaintext 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
 
  <script>
  $(document).ready(function(){
 
    var i = 0;
    $("div.overout").mouseover(function(){
      $("p:first",this).text("mouse over");
      $("p:last",this).text(++i);
    }).mouseout(function(){
      $("p:first",this).text("mouse out");
    });
 
    var n = 0;
    $("div.enterleave").bind("mouseenter",function(){
      $("p:first",this).text("mouse enter");
      $("p:last",this).text(++n);
    }).bind("mouseleave",function(){
      $("p:first",this).text("mouse leave");
    });
 
  });
  </script>
  <style>
div.out {
width:40%;
height:120px;
margin:0 15px;
background-color:#D6EDFC;
float:left;
}
div.in {
width:60%;
height:60%;
background-color:#FFCC00;
margin:10px auto;
}
p {
line-height:1em;
margin:0;
padding:0;
}
</style>
</head>
<body>
 
<div class="out overout"><p>move your mouse</p><div class="in overout"><p>move your mouse</p><p>0</p></div><p>0</p></div>
<div class="out enterleave"><p>move your mouse</p><div class="in enterleave"><p>move your mouse</p><p>0</p></div><p>0</p></div>
 
</body>
</html>
 
[HTML] pobierz, plaintext

Interesuje mnie tylko jedna z klas powiedzmy "overout". I teraz na górze jest kod od tego w java script:

[HTML] pobierz, plaintext 
 var i = 0;
    $("div.overout").mouseover(function(){
      $("p:first",this).text("mouse over");
      $("p:last",this).text(++i);
    }).mouseout(function(){
      $("p:first",this).text("mouse out");
    });
 
[HTML] pobierz, plaintext

ten kod z tego co zauwazyłem (w javascript raczkuje) mówi o tym że po najechaniu myszką pojawi się tekst "mouse over". Tutaj mógłbym wpisać dowolny tekst jaki się może pojawić, ale ja potrzebuję wstawić linka w postaci:

[HTML] pobierz, plaintext 
<a href='index.php?glob={$_GET['glob']}&plik={$spr['plik']}&nazwa={$spr['nazwa']}&id_kat={$spr['id_kategorii']}&id_mie={$spr['id_miejsca']}&id_dat={$spr['id_daty']}&id=".$spr['id']."'>Następne</a>
[HTML] pobierz, plaintext

Jak to zrobić?
dodam, że jak wstawie w tej chwili tego linka to pokaże mi się on cały jako tekst, a nie w klikalnej postaci. I jest jeszcze jeden problem że ten link w kodzie PHP występuje w pętli, więc nie będzie on stały, ale zmieniał się w zaleznosci od zaciąganych danych z bazy.

tvister

2.12.2009, 14:10:01

Dawno się nie bawiłem jQuery ale..
Stwórz 'element' DOM nadaj atrybut href i zrób chyba ..appendchild do $("p:first",this).
Odnośnie zmienności linku to dodatkowo nadaj dla 'element' id aby móc się do niego odwołać.

lamcpp

2.12.2009, 14:19:14

ech..to trochę za trudne poki co dla mnie, dopiero czytam podstawy jquery o tym co to jest element DOM.
Mógłbys trochę bardziej nakierować?

tvister

2.12.2009, 14:35:44

Odnośnie wiedzy na temat DOM Element to tutaj

A tu masz przykład tego co napisałem w wcześniej

[JAVASCRIPT] pobierz, plaintext 
var a = $("<a></a>").attr('href','#').click(somefunction);  
 $('#toolbar').append(a);
[JAVASCRIPT] pobierz, plaintext

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.