thumbnail mit Rahmen wenn Aktiv

[Gast] Foren Programmierung/Entwicklung JavaScript thumbnail mit Rahmen wenn Aktiv

Programmierung/Entwicklung

Themen

Beiträge

Moderatoren

Letzter Beitrag

JavaScript

1407

5346

Thomas Richard

6. Jun 2023, 09:44

meinereiner69

darkStar

Beiträge gesamt: 4

17. Mai 2011, 11:34
Beitrag # 1 von 3
Bewertung:
(3020 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Hallo

Ich habe eine Bildergalerie mit Thumbnails und einer Grossansicht. Wenn ein Thumbnail in der Grossansicht aktiv ist, sollte dieses Thumbnail dann markiert/ umrandet sein.

Bildwechsel:

Code

 <script type="text/javascript" language="JavaScript"> 
<!-- 
//Bilder tauschen 
function swap(Bildname,BildURL,BildTitel) 
{ 
document.images[Bildname].src = BildURL; 
document.getElementById('bild_titel').innerHTML=BildTitel; 
} 
//--> 
</script>

Aufruf (thumbs werden in einer mysql/php-schleife generiert):

Code

<a href="#" onClick="swap('bild1','news/upload/bilder/<?php echo $row->bild;?>','<?php echo $row->bildtitel;?>');" onmouseover="Tip('<img src=\'news/upload/bilder/thumbs/<?php echo $row->bild;?>\' />')"> 
<img id="<?php echo $x;?>" src="news/upload/bilder/thumbs/<?php echo $row->bild;?>" border="0" class="thumbs"></a>

Wie muss ich den Code ergänzen, das das entsprechende thumbnail markiert ist? Jemand ev. ein Tipp für mich?

thumbnail mit Rahmen wenn Aktiv

crisies

Beiträge gesamt: 136

25. Mai 2011, 23:42
Beitrag # 2 von 3
Beitrag ID: #472316
Bewertung:
(2969 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

hi darkstar,

ich denke das markieren wäre hier nicht das problem, vielmehr das demarkieren sobald ein anderes thumbnail geladen wird. Du kannst dafür entweder ein hidden-Formfield verwenden um dort die ID das aktuell aktivierte Bildes reinzuschreiben oder du machst es über eine "globale" JS-Variabel.

So könntest Du markieren/demarkieren:

Code

var activeTumb = '0'; 
function swap(Bildname,BildURL,BildTitel,Thumb)  
{  
document.getElementById(activeTumb ).style.border = '0'; 
activeTumb = Thumb; 
document.getElementById(Thumb).style.border = '1px solid';  
document.images[Bildname].src = BildURL;  
document.getElementById('bild_titel').innerHTML=BildTitel;  
}

Code

<a href="#" onClick="swap('bild1','news/upload/bilder/<?php echo $row->bild;?>','<?php echo $row->bildtitel;?>','<?php echo $x;?>');" onmouseover="Tip('<img src=\'news/upload/bilder/thumbs/<?php echo $row->bild;?>\' />')">  
<img id="<?php echo $x;?>" src="news/upload/bilder/thumbs/<?php echo $row->bild;?>" border="0" class="thumbs"></a>

gruss
chris.w.

als Antwort auf: [#471626]

thumbnail mit Rahmen wenn Aktiv

darkStar

Beiträge gesamt: 4

26. Mai 2011, 04:50
Beitrag # 3 von 3
Beitrag ID: #472321
Bewertung:
(2957 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

Hi Chris

Super!
Vielen Dank für Deine Hilfe!

Lg

als Antwort auf: [#472316]

Aktuell

Farbmanagement

ColorLogic präsentiert ColorAnt 9

| 04.01.2023

Weitere Events

Neuste Foreneinträge

Verweis auf Lesezeichen, die von IHV-Funktion erstellt wurden

Elemente lï¿½schen geht nicht

PC, Indesign und Connect Fonts

Eigenes Plug-in erstellen

Affinity Designer (Mac) eigene Vektor-Schraffuren als Stil speichern

Affinity 2.2 wurde verï¿½ffentlicht

Daten aus ï¿½Dateiinformationenï¿½ in InDesign automatisch nutzen

Tastaturkï¿½rzel 2023

Glyphen Formatvariante [INDD 18.5 WIN10]

Willst du mein guter Boy sein?

Weitere Stellenangebote