Bild im selben Fenster über Link öffnen / Positionieren

Niceo · 27.09.2010, 16:17

Liebe Gemeinde,

ich bin neu hier, befasse mich erst seit kurzem mit dem Bereich PHP und bastle seit geraumer Zeit an einer Bildergalerie rum:

Es werden Bilder als Thumbs aus einem Verzeichnis via PHP ausgegeben. Der Thumb soll wenn man ihn aufruft, das entsprechende Bild in seiner vollen Dimension an einer bestimmten Position der Seite wiedergeben.

In HTML würde ich hier einfach 2 Frames definieren. In Frame 1 die Thumbs abbilden und in Frame 2 das Bild über einen Link der Thumbs öffnen.

In PHP stehe ich hier aber auf dem Schlauch. Wer kann mir helfen?

Ich hoffe ich habe es annehmbar erklärt und ihr versteht nicht nur alle Bahnhof...

Code:

<html>

<head>

<title>Galerie</title>

<meta http-equiv="expires" content="0; charset=iso-8859-1" />

<style type="text/css">
* { margin: 0; padding: 0; }
#nav { float: left; width: 180px; }
#preview { float: left; }
ul { margin: 25px; }
li a { color: #0000FF; text-decoration: none; }
li a:hover { color: #FF0000; text-decoration: underline; }
a.thumb img { filter:alpha(opacity=50); -moz-opacity: 0.50; opacity: 0.50; border: solid 2px #FFFFFF; }
a.thumb:hover img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;	}
</style>

</head>

<body>

<?php
// Galerien ermitteln
$verzeichnisse = glob( "galerien/*", GLOB_ONLYDIR );
echo '<div id="nav"><ul>';
foreach ($verzeichnisse as $dir)
{
	$dirname = array_pop( explode( "/", $dir ) );
	echo '<li><a href="' .$_SERVER['PHP_SELF']. '?galerie=' .$dirname. '">' .$dirname. '</a></li>';
}
echo '</ul></div>';


// Galerie anzeigen
if (isset( $_GET['galerie'] ) )
{
	echo '<div id="preview">';
	$break = 1;
	$bilder = glob( "galerien/{$_GET['galerie']}/thumbs/*.jpg" );
	natsort( $bilder );
	foreach ($bilder as $bild)
	{
		$bild = array_pop( explode( "/", $bild ) );
		echo '<a href="galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '" title="&lt;a href=\'download.php?get=galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '\'&gt;Bild herunterladen&lt;/a&gt;" class="thumb"><img src="galerien/' .$_GET['galerie']. '/thumbs/' .$bild. '" /></a>';
		echo ($break % 2 == 0) ? "<br />\n" : "";
		$break++;
	}
	echo '</div>';
}
?>

</body>

</html>

Danke.

Niceo.

chorn · 27.09.2010, 16:39

Du hast ja schon $_GET['galerie'], jetzt brauchst du das Ganze nur nochmal für das einzelne Bild, dass du als Parameter mitgibst und da ausgeben lässt wo du willst.

Manko10 · 27.09.2010, 16:43

Bitte lies dir den Artikel Was ist PHP aus unserem Wiki aufmerksam durch.

Themenmoderation:
[→] Verschoben von PHP Einsteiger

Niceo · 27.09.2010, 17:39

Gut, danke soweit mal - dann werde ich mich jetzt durchs Wiki beißen. Es wäre natürlich toll wenn mir den richtigen Code jemand posten und erklären könnte.

Liebe Grüße,

Niceo der Anfänger.

Niceo · 28.09.2010, 12:14

Hallo,

ich habe mir über Nacht einige Anfänger-Wikis durchgelesen. U.a. die Grundlagen von Peter Kropff - ist ein sehr gutes Einstiegsmedium. Ist wirklich sehr interessant und ich bleib am Ball.

Aber:

Ich versteh immernoch nicht wie ich in dem Script das entsprechende Bild über den Link positionieren kann.

PHP-Code:

  echo '<a href="galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '" title="&lt;a href=\'download.php?get=galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '\'&gt;Bild herunterladen&lt;/a&gt;" class="thumb"><img src="galerien/' .$_GET['galerie']. '/thumbs/' .$bild. '" /></a>';

Mir schnackelts hier einfach nicht. Kann mir einer bitte des Rätsels Lösung erklären?

Vielen Dank.

Der Gelehrige.

chorn · 28.09.2010, 12:56

Du hast den Link. Erweiterst ihn um einen Parameter mit der URL des Bildes. In der Datei die du mit dem Link aufrufst lässt du HTML ausgeben. An irgendeiner Stelle steht dann das Bild.

Code:

echo '<html><img src="' . $_GET['Bildurl'] . '" /></html>';

Manko10 · 28.09.2010, 15:37

Hast du dir den von mir verlinkten Artikel aufmerksam durchgelesen? Darin wird nämlich erklärt, dass dein Problem nichts mit PHP zu tun hat, sondern ein generelles HTML-Problem ist.

Niceo · 28.09.2010, 21:42

Also ich peil das immer noch nicht. Ich werde mir bis zum Wochenende nochmal ein paar Erklärungen dazu rein pfeifen und hoffe dass ich dann mehr durchsteige.

@chorn: Danke für deine Hilfe - ich stecke um das zu verstehen wohl noch zu tief in den Kinderschuhen von PHP, oder ich hab mich falsch ausgedrückt..

@Manko10: Es handelt sich wie ich das hier betrachte nicht um ein generelles HTML-Problem. Wenn ich das richtig sehe, muss ich in ein DIV eine Blind-Grafik einbetten, welche ich dann durch Anklicken der Thumbs anspreche/austausche. Ansonsten wir die Grafik immer alleine in einer neuen Seite angezeigt. Oder nicht? Und wenn ich recht haben sollte: Was hat das dann mit HTML zu tun?

Was ich habe: Thumbs, welche dynamisch aus einem Ordner geladen werden, die wenn man sie anklickt in einer neuen Seite in ihrer jeweiligen Originalgröße angezeigt werden.

Was ich brauche: Das was ich habe, nur dass die Bilder in ihrer Originalgröße nicht in einer neuen Seite, sondern in der bestehenden Seite an einer bestimmten Position neben den Thumbs angezeigt werden sollen.

Danke für eure Geduld und liebe Grüße,

Niceo.

BlackScorp · 29.09.2010, 08:37

du hast im grunde nur ein einfaches link, welches ein bild öffnet, das was du suchst , kann man mit javascript lösen. du erstellst dir ein anzeige div(also das div wo später dein bild in voller größe angezeigt werden soll) und machst es unsichtbar. dann erstellst du in javascript eine funktion

PHP-Code:

  function displayImage(imageURL){

var element = document.getElementById("previewDIV");

element.style.backgroundImage = "url("+imageURL+")";

}

und in deinen links aktivierst du das onclick ereignis etwa so

PHP-Code:

  <a href="javascript:void(0)" onclick="displayImage(\"galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). \")"..

oder du schaust dir gleich javascript thumbnail gallerien an und implementierst die in deinen script

MFG

Niceo · 29.09.2010, 23:02

Hey BlackScorp,

habs probiert und bekomm nen Fehler... Die Thumbs gehen leider nicht wie gewümscht auf.

Ist halt mal wieder denk ich mal ein Anfängerfehler.

PHP-Code:

 
<body>

 
<div id="imageBox">

   <img src="pic00.jpg" alt="" name="start">

</div>

 
<script type="text/javascript">

// swapImage

function displayImage(imageURL){ 

var element = document.getElementById("imageBox"); 

element.style.backgroundImage = "url("+imageURL+")"; 

}

//-->

</script>

 
 
<?php

// Galerien ermitteln

$verzeichnisse = glob( "galerien/*", GLOB_ONLYDIR );

echo '<div id="nav"><ul>';

foreach ($verzeichnisse as $dir)

{

    $dirname = array_pop( explode( "/", $dir ) );

    echo '<li><a href="' .$_SERVER['PHP_SELF']. '?galerie=' .$dirname. '">' .$dirname. '</a></li>';

}

echo '</ul></div>';

 
// Galerie anzeigen

if (isset( $_GET['galerie'] ) )

{

    echo '<div id="preview">';

    $break = 1;

    $bilder = glob( "galerien/{$_GET['galerie']}/thumbs/*.jpg" );

    natsort( $bilder );

    foreach ($bilder as $bild)

    {

        $bild = array_pop( explode( "/", $bild ) );

        echo '<a href="javascript:void(0)" onclick="displayImage("galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '") class="thumb"><img src="galerien/' .$_GET['galerie']. '/thumbs/' .$bild. '" /></a>';

        echo ($break % 2 == 0) ? "<br />\n" : "";

        $break++;

    }

    echo '</div>';

}

?>

 
</body>

Was mach ich falsch? Hab ich was vergessen?

Geh nu mal schlafen.

Niceo.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[Erledigt] Link im gleichen Fenster öffnen? [Einfache Frage]	Ditb	PHP Tipps 2009	5	03.01.2010 19:50
[Erledigt] gesamte Spalte in Array abspeichern	Kotbatzen	PHP Tipps 2009	23	05.09.2009 00:01
Anderen Link im gleichen Fenster öffnen	Daskaras	PHP Tipps 2005-2	2	16.08.2005 11:36
Suche Tipps für Persormance-Steigerung (Geld für Nützliches)		Beitragsarchiv	18	16.08.2005 10:57
neues fenster öffnen	janni	HTML, Usability und Barrierefreiheit	1	24.06.2005 10:13
Bild (.jpg) mit Link auf Festplatte speichern	PsychoEagle	PHP Tipps 2005-2	11	16.06.2005 14:54
über Bild gelegter Link nichtg anwählbar	Stümper	HTML, Usability und Barrierefreiheit	7	22.03.2005 19:54
Bild in seperatem (pop-up) Fenster öffnen	Malfunction	PHP Tipps 2005	7	02.03.2005 08:38
[Erledigt] Link in neuem Fenster öffnen -- Fullscreen		HTML, Usability und Barrierefreiheit	2	17.11.2004 11:03
[Erledigt] über ein Link --> Tabelleneintrag		PHP Tipps 2004	9	03.11.2004 17:09
Übern Link öffnet sich ein Kleines Fenster	themonk	HTML, Usability und Barrierefreiheit	3	13.10.2004 19:27
Javascript Fenster über PHP Link	Mano	PHP Tipps 2004	2	07.10.2004 17:50
Aktuelle Seite = Link aus einer Datei => BILD?		PHP Tipps 2004	2	07.09.2004 21:49
[Erledigt] Link in neuem Fenster öffnen - JS		HTML, Usability und Barrierefreiheit	3	02.09.2004 15:17
neues Fenster, mit voher definierter Größe, über Link öffnen		HTML, Usability und Barrierefreiheit	7	21.06.2004 12:43


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

27.09.2010, 16:39
chorn Erfahrener Benutzer Registriert seit: 07.12.2009 Beiträge: 843 PHP-Kenntnisse: Fortgeschritten	Du hast ja schon $_GET['galerie'], jetzt brauchst du das Ganze nur nochmal für das einzelne Bild, dass du als Parameter mitgibst und da ausgeben lässt wo du willst.

27.09.2010, 16:43
Manko10 Supermoderator HD Registriert seit: 16.03.2008 Beiträge: 8.706 PHP-Kenntnisse: Fortgeschritten	Bitte lies dir den Artikel Was ist PHP aus unserem Wiki aufmerksam durch. Themenmoderation: [→] Verschoben von PHP Einsteiger __________________ Refining Linux Advent Calendar series “24 Outstanding ZSH Gems”

27.09.2010, 17:39
Niceo Neuer Benutzer Registriert seit: 27.09.2010 Beiträge: 5 PHP-Kenntnisse: Anfänger	Gut, danke soweit mal - dann werde ich mich jetzt durchs Wiki beißen. Es wäre natürlich toll wenn mir den richtigen Code jemand posten und erklären könnte. Liebe Grüße, Niceo der Anfänger.

28.09.2010, 12:14
Niceo Neuer Benutzer Registriert seit: 27.09.2010 Beiträge: 5 PHP-Kenntnisse: Anfänger	Hallo, ich habe mir über Nacht einige Anfänger-Wikis durchgelesen. U.a. die Grundlagen von Peter Kropff - ist ein sehr gutes Einstiegsmedium. Ist wirklich sehr interessant und ich bleib am Ball. Aber: Ich versteh immernoch nicht wie ich in dem Script das entsprechende Bild über den Link positionieren kann. PHP-Code: `echo '<a href="galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '" title="<a href=\'download.php?get=galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '\'>Bild herunterladen</a>" class="thumb"><img src="galerien/' .$_GET['galerie']. '/thumbs/' .$bild. '" /></a>';` Mir schnackelts hier einfach nicht. Kann mir einer bitte des Rätsels Lösung erklären? Vielen Dank. Der Gelehrige.

28.09.2010, 12:56
chorn Erfahrener Benutzer Registriert seit: 07.12.2009 Beiträge: 843 PHP-Kenntnisse: Fortgeschritten	Du hast den Link. Erweiterst ihn um einen Parameter mit der URL des Bildes. In der Datei die du mit dem Link aufrufst lässt du HTML ausgeben. An irgendeiner Stelle steht dann das Bild. Code: echo '<html><img src="' . $_GET['Bildurl'] . '" /></html>';

28.09.2010, 15:37
Manko10 Supermoderator HD Registriert seit: 16.03.2008 Beiträge: 8.706 PHP-Kenntnisse: Fortgeschritten	Hast du dir den von mir verlinkten Artikel aufmerksam durchgelesen? Darin wird nämlich erklärt, dass dein Problem nichts mit PHP zu tun hat, sondern ein generelles HTML-Problem ist. __________________ Refining Linux Advent Calendar series “24 Outstanding ZSH Gems”

28.09.2010, 21:42
Niceo Neuer Benutzer Registriert seit: 27.09.2010 Beiträge: 5 PHP-Kenntnisse: Anfänger	Also ich peil das immer noch nicht. Ich werde mir bis zum Wochenende nochmal ein paar Erklärungen dazu rein pfeifen und hoffe dass ich dann mehr durchsteige. @chorn: Danke für deine Hilfe - ich stecke um das zu verstehen wohl noch zu tief in den Kinderschuhen von PHP, oder ich hab mich falsch ausgedrückt.. @Manko10: Es handelt sich wie ich das hier betrachte nicht um ein generelles HTML-Problem. Wenn ich das richtig sehe, muss ich in ein DIV eine Blind-Grafik einbetten, welche ich dann durch Anklicken der Thumbs anspreche/austausche. Ansonsten wir die Grafik immer alleine in einer neuen Seite angezeigt. Oder nicht? Und wenn ich recht haben sollte: Was hat das dann mit HTML zu tun? Was ich habe: Thumbs, welche dynamisch aus einem Ordner geladen werden, die wenn man sie anklickt in einer neuen Seite in ihrer jeweiligen Originalgröße angezeigt werden. Was ich brauche: Das was ich habe, nur dass die Bilder in ihrer Originalgröße nicht in einer neuen Seite, sondern in der bestehenden Seite an einer bestimmten Position neben den Thumbs angezeigt werden sollen. Danke für eure Geduld und liebe Grüße, Niceo.

29.09.2010, 08:37
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	du hast im grunde nur ein einfaches link, welches ein bild öffnet, das was du suchst , kann man mit javascript lösen. du erstellst dir ein anzeige div(also das div wo später dein bild in voller größe angezeigt werden soll) und machst es unsichtbar. dann erstellst du in javascript eine funktion PHP-Code: `function displayImage(imageURL){ var element = document.getElementById("previewDIV"); element.style.backgroundImage = "url("+imageURL+")"; }` und in deinen links aktivierst du das onclick ereignis etwa so PHP-Code: `<a href="javascript:void(0)" onclick="displayImage(\"galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). \")"..` oder du schaust dir gleich javascript thumbnail gallerien an und implementierst die in deinen script MFG __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

29.09.2010, 23:02
Niceo Neuer Benutzer Registriert seit: 27.09.2010 Beiträge: 5 PHP-Kenntnisse: Anfänger	Hey BlackScorp, habs probiert und bekomm nen Fehler... Die Thumbs gehen leider nicht wie gewümscht auf. Ist halt mal wieder denk ich mal ein Anfängerfehler. PHP-Code: <body> <div id="imageBox"> <img src="pic00.jpg" alt="" name="start"> </div> <script type="text/javascript"> // swapImage function displayImage(imageURL){ var element = document.getElementById("imageBox"); element.style.backgroundImage = "url("+imageURL+")"; } //--> </script> <?php // Galerien ermitteln $verzeichnisse = glob( "galerien/", GLOB_ONLYDIR ); echo '<div id="nav"><ul>'; foreach ($verzeichnisse as $dir) { $dirname = array_pop( explode( "/", $dir ) ); echo '<li><a href="' .$_SERVER['PHP_SELF']. '?galerie=' .$dirname. '">' .$dirname. '</a></li>'; } echo '</ul></div>'; // Galerie anzeigen if (isset( $_GET['galerie'] ) ) { echo '<div id="preview">'; $break = 1; $bilder = glob( "galerien/{$_GET['galerie']}/thumbs/.jpg" ); natsort( $bilder ); foreach ($bilder as $bild) { $bild = array_pop( explode( "/", $bild ) ); echo '<a href="javascript:void(0)" onclick="displayImage("galerien/' .$_GET['galerie']. '/images/' .urlencode( $bild ). '") class="thumb"><img src="galerien/' .$_GET['galerie']. '/thumbs/' .$bild. '" /></a>'; echo ($break % 2 == 0) ? "<br />\n" : ""; $break++; } echo '</div>'; } ?> </body> Was mach ich falsch? Hab ich was vergessen? Geh nu mal schlafen. Niceo.