Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [php] Powiększanie zdjęć
pjamorski
post
Post #1





Grupa: Zarejestrowani
Postów: 112
Pomógł: 0
Dołączył: 16.01.2008

Ostrzeżenie: (0%)
-----

Cześć

Mam sobie taki kod :

Kod
<table border='1' align='center' valign='top' background='tlo.png'>
    <tr><td width='500' height='490' align='center' valign='top'>
        <table border='1' align='left' valign='top' background='tlo.png' cellpadding='5' cellspacing='10'>
        <tr><td width='100' height='100' align='left' valign='top' ><img src='gosia/1.jpg' width='100' height='100'>1</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/2.jpg' width='100' height='100'>2</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/3.jpg' width='100' height='100'>3</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/4.jpg' width='100' height='100'>4</td>
        </tr>    
        <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/5.jpg' width='100' height='100'>5</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/6.jpg' width='100' height='100'>6</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/7.jpg' width='100' height='100'>7</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/8.jpg' width='100' height='100'>8</td>
        </tr>
        <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/9.jpg' width='100' height='100'>9</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/10.jpg' width='100' height='100'>10</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/11.jpg' width='100' height='100'>11</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/12.jpg' width='100' height='100'>12</td>
        </tr>    
        <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/13.jpg' width='100' height='100'>13</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/14.jpg' width='100' height='100'>14</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/15.jpg' width='100' height='100'>15</td>
            <td width='100' height='100' align='left' valign='top'><img src='gosia/16.jpg' width='100' height='100'>16</td>
        </tr>    
        </table>
    </td></tr></table>


Jak widać jest to tabeleczka z przykłądową zawartością fotek. Wszystko działa wporzo. Jak mógłbym uzyskać coś takiego że po najechaniu kursorem mychy zdjęcię w ramce powiększy się troszkę. Fajnie jakby ten efekt działał na każde najechane zdjęcie. Proszę o mały przykład na jednym tylko zdjęciu.
Dzięki wielkie

P.S.
Szukałem w stylach css, coś jak a.hover na linki itd, ale porażka sciana.gif


--------------------


Chęci to nie wszystko, trzeba działać.
B. Lee
Go to the top of the page
+Quote Post
Lion_87
post
Post #2





Grupa: Zarejestrowani
Postów: 850
Pomógł: 120
Dołączył: 15.02.2007
Skąd: Łódź

Ostrzeżenie: (10%)
X----

polecam google!!! Od tak np:
http://vivee.info/2007/12/28/galeria-z-pow...mi-miniaturami/
Go to the top of the page
+Quote Post
pjamorski
post
Post #3





Grupa: Zarejestrowani
Postów: 112
Pomógł: 0
Dołączył: 16.01.2008

Ostrzeżenie: (0%)
-----

Jak dla mnie to troszeczkę jest zagmatwane.
Mógłbym proscić o coś bardziej easy?

Dzięki


--------------------


Chęci to nie wszystko, trzeba działać.
B. Lee
Go to the top of the page
+Quote Post
-Wieviór-
post
Post #4





Goście
Ale co jest zagmatwane? Masz gotowy kod z dobrym wytłumaczeniem, czego chcieć więcej? ;]
Go to the top of the page
+Quote Post
pjamorski
post
Post #5





Grupa: Zarejestrowani
Postów: 112
Pomógł: 0
Dołączył: 16.01.2008

Ostrzeżenie: (0%)
-----

Ja się jeszcze na tym nie znam. Czy to muszę jako Javascript wstawić?

kod:

  1. Kod
    [*]$(document).ready(function() {[*] $("li").fadeTo("slow", .5);[*] $("li").hover(function(){[*] $(this).addClass("big").fadeTo("fast", 1);[*] },function(){[*] $(this).removeClass("big").fadeTo("fast", .5);[*] });[*] });
To właśnie jest dla mnie nie zrozumiałe sciana.gif


--------------------


Chęci to nie wszystko, trzeba działać.
B. Lee
Go to the top of the page
+Quote Post
Lion_87
post
Post #6





Grupa: Zarejestrowani
Postów: 850
Pomógł: 120
Dołączył: 15.02.2007
Skąd: Łódź

Ostrzeżenie: (10%)
X----

hmmmmmmmmmmm
to wejdź se na tą stronę co Ci linka podałem i wejdź w przykład a potem:

myszką w lewy górny róg --------->Plik
potem--------->Zapisz stronę jako

no i już gotowe. Masz ją i se zmieniaj jak chcesz!!!!!!!!!!!!!!!!!!!!!!

Ten post edytował Lion_87 4.02.2008, 12:45:03
Go to the top of the page
+Quote Post
nowotny
post
Post #7





Grupa: Zarejestrowani
Postów: 875
Pomógł: 122
Dołączył: 2.02.2008

Ostrzeżenie: (0%)
-----

Ehhh... lenistwo się szerzy... ;P Ukradzione z ww. strony: winksmiley.jpg
[HTML] pobierz, plaintext 
  1. <html><body>
  2. <style>
  3. img {                         
  4. 	width:100px;
  5. 	height:100px;
  6. 	border:2px white solid;
  7. 	background:white 50% 50%;
  8. 	float:left;
  9. 	margin:5px;
  10. 	position:relative;
  11. }
  12. .big {
  13. 	height: 250px;
  14. 	width: 250px;
  15. }</style>
  16. <script type="text/javascript" src="jquery.js"></script>
  17. <script>
  18.     $(document).ready(function() {
  19.  
  20.         $("img").fadeTo("slow", .5);
  21.  
  22.         $("img").hover(function(){
  23.             $(this).addClass("big").fadeTo("fast", 1);
  24.         },function(){
  25.               $(this).removeClass("big").fadeTo("fast", .5);
  26.         });
  27.  
  28.         });
  29. </script>
  30. <table border='1' align='center' valign='top' background='tlo.png'>
  31.     <tr><td width='500' height='490' align='center' valign='top'>
  32.         <table border='1' align='left' valign='top' background='tlo.png' cellpadding='5' cellspacing='10'>
  33.         <tr><td width='100' height='100' align='left' valign='top' ><img src='gosia/1.jpg' width='100' height='100'>1</td>
  34.             <td width='100' height='100' align='left' valign='top'><img src='gosia/2.jpg' width='100' height='100'>2</td>
  35.             <td width='100' height='100' align='left' valign='top'><img src='gosia/3.jpg' width='100' height='100'>3</td>
  36.             <td width='100' height='100' align='left' valign='top'><img src='gosia/4.jpg' width='100' height='100'>4</td>
  37.         </tr>    
  38.         <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/5.jpg' width='100' height='100'>5</td>
  39.             <td width='100' height='100' align='left' valign='top'><img src='gosia/6.jpg' width='100' height='100'>6</td>
  40.             <td width='100' height='100' align='left' valign='top'><img src='gosia/7.jpg' width='100' height='100'>7</td>
  41.             <td width='100' height='100' align='left' valign='top'><img src='gosia/8.jpg' width='100' height='100'>8</td>
  42.         </tr>
  43.         <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/9.jpg' width='100' height='100'>9</td>
  44.             <td width='100' height='100' align='left' valign='top'><img src='gosia/10.jpg' width='100' height='100'>10</td>
  45.             <td width='100' height='100' align='left' valign='top'><img src='gosia/11.jpg' width='100' height='100'>11</td>
  46.             <td width='100' height='100' align='left' valign='top'><img src='gosia/12.jpg' width='100' height='100'>12</td>
  47.         </tr>    
  48.         <tr><td width='100' height='100' align='left' valign='top'><img src='gosia/13.jpg' width='100' height='100'>13</td>
  49.             <td width='100' height='100' align='left' valign='top'><img src='gosia/14.jpg' width='100' height='100'>14</td>
  50.             <td width='100' height='100' align='left' valign='top'><img src='gosia/15.jpg' width='100' height='100'>15</td>
  51.             <td width='100' height='100' align='left' valign='top'><img src='gosia/16.jpg' width='100' height='100'>16</td>
  52.         </tr>    
  53.         </table>
  54.     </td></tr></table></body></html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 21.08.2025 - 07:58
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn