Forum PHP.pl > [HTML][JavaScript] Wyświetlanie obrazka

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [HTML][JavaScript] Wyświetlanie obrazka

patryk20120

2.02.2009, 15:58:41

Witam,
mam takie pytanie

Mam parę obrazków na stronie i moje pytanie brzmi, czy jest możliwość zrobienia takiego czegoś, że po najechaniu na jeden obrazek, wyświetli on się w jakimś div'ie i to samo z innymi, aby JS, jakoś "automatycznie" pobierała zdjęcie z <img> na którym jest myszka

proszę chociaż o jakieś wskazówki

skowron-line

2.02.2009, 16:13:47

[HTML] pobierz, plaintext 
function doIt( obj )
{
document.getElementById( 'oImg' ).setAttribute( 'src', obj.getAttribute( 'src' ) );
}
 
<img src="abc.jpg" onmouseover="doIt( this );">
 
<img src="default.jpg" id="oImg">
[HTML] pobierz, plaintext

*pisane z palca.

patryk20120

2.02.2009, 16:31:49

Dzieki

a jak zrobić, aby po "ściągnięciu" kursora z obrazka, obrez oImg znikł ?
mam takie cos i nie działa:

[PHP] pobierz, plaintext 
<?php
onmouseout="doIt2( this );"
oraz 
function doIt2( obj )
{
document.getElementById( 'oImg' ).setAttribute( 'src', 'de' );
}
?>
[PHP] pobierz, plaintext

skowron-line

2.02.2009, 16:44:44

[HTML] pobierz, plaintext 
function doIt2( )
{
document.getElementById( 'oImg' ).setAttribute( 'src', '' );
}
[HTML] pobierz, plaintext

onmouseout="doIt();"

patryk20120

2.02.2009, 20:45:03

niestety, obrazek dalej nie znika :/

Ok już działa ;-) dzięki, a jak zrobić, aby zdjęcie wyświetlało mi się również w tym kodzie, bo się nie wyświetla

[PHP] pobierz, plaintext 
<?php
<span class="tooltip_text" href="#" onmousemove="showToolTip(event,'<b>test</b><br><img id=oImg >');return false" onmouseout="hideToolTip()" >
?>
[PHP] pobierz, plaintext

zurek

3.02.2009, 21:46:19

A ja mam podobne pytanie, ale nie chcę zaśmiecać forum i zakładać nowego wątku. Co zrobić, żeby po najechaniu na link, w osobnym div'ie pojawiał się odpowiedni obrazek. W miarę proste, ale co zrobić żeby to było dynamiczne. Na przykład ściągam dane z bazy danych i za pomocą PHP wyświetlam je na stronie w postaci odsyłaczy. Nazwy i rozszerzenia obrazków też są z bazy. I nie wiem właśnie co zrobić, żeby to jakoś funkcjonowało dynamicznie.

Z góry dzięki za pomoc

patryk20120

6.02.2009, 21:12:10

jeszcze jedno małe pytanie, czemu jak mam w tym:

[PHP] pobierz, plaintext 
<?php
<span class="tooltip_text" href="#" onmousemove="showToolTip(event,' <b>test</b><br><img id=oImg >');return false" onmouseout="hideToolTip()" >
?>
[PHP] pobierz, plaintext

to mi ten obrazek sie nie zmienia po najechaniu

Może ten img w span'ie nie zdąży sie zmienic przed wyświetleniem

piotrooo89

6.02.2009, 22:05:11

uczę się dopiero jQuery ale zrobiłem coś takiego:

[HTML] pobierz, plaintext 
<head>
<script type="text/javascript" src="jquery.js"></script>
 
<script type="text/javascript">
$(document).ready(function()
{  
	$("div.min").mouseover(function () 
	{
		$("div.jpg").show("slow");
	});
	$("div.min").mouseout(function () 
	{
		$("div.jpg").hide("slow");
	});
});
</script>
 
</head>
<body>
	<div class="min"><img src="miniaturka.jpg"></div>
 
	<div class="jpg" style="display: none;">
		<img class="mini" src="obrazek.jpg">
	</div>
</body>
[HTML] pobierz, plaintext

patryk20120

7.02.2009, 10:17:47

Tu jest wyświetlanie diva z tym obrazkiem, o ile sie nie mylę, a to już mam, lecz obrazek nie działa mi w tym kodzie:

[PHP] pobierz, plaintext 
<?php
<span class="tooltip_text" href="#" onmousemove="showToolTip(event,' <b>test</b><br><img id=oImg >');return false" onmouseout="hideToolTip()" >
?>
[PHP] pobierz, plaintext

outsider

7.02.2009, 11:05:09

W  nie ma href ! Moze o takie cos Ci chodzilo:

Kod

<a href="#" onmousemove="showToolTip(event,' test <img id=oImg >');return false" onmouseout="hideToolTip()" >Tekst</a>

patryk20120

7.02.2009, 14:32:08

*OuTSideR*, nie o to mi chodzi

przeczytaj 2 post od góry, jest to funkcja, gdy najadę na jakiś obrazek, pokazuje on mi sie w danym miejscu, lecz nie działa on w tym kodzie :/

[PHP] pobierz, plaintext 
<?php
<span class="tooltip_text" href="#" onmousemove="showToolTip(event,' <b>test</b><br><img id=oImg >');return false" onmouseout="hideToolTip()" >
?>
[PHP] 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.