Erledigt: rel Attribut per CSS einfügen

Webentwicklung XHTML / CSS
 
Hallo zusammen,

ich habe jetzt den halben Sonntag damit verbracht das hinzubekommen und mir alles mögliche zusammen gebastelt, komme aber zu keinem Ergebnis.

Ich möchte per CSS den Links in einem div immer das Attribut rel=“lightbox“ zuweisen. Ich habe es mit „content:“,“before“ und solchen Dingen versucht komme aber auf kein Ergebnis.

Vielleicht könnte mir ja jemand den passenden Tipp geben.

Gruß und Danke

Andreas
Link zu diesem Beitrag in die Zwischenablage kopieren
Mister Ad
Werbung
Schon mal bei Saturn, DaWanda oder notebooksbilliger.de geguckt? Vielleicht wirst du dort fuendig.

 
du bist ein bisschen früh dran mit den pseudo-klassen, zumindest „content“ ist noch gar nicht übergreifend implementiert () (nur in den neusten versionen, und da unzureichend).

gibt es einen bestimmten grund warum du das per css machen willst? wäre ein JS-framework eine mögliche alternative?
Link zu diesem Beitrag in die Zwischenablage kopieren
Naja, ich bin kein Programmierer und eigene mir Dinge dann an wenn ich sie brauche. Dementsprechend bin ich einfach mal davon ausgegangen dass das per CSS geht.

Ich bin aber für Alternativen offen, also leg los. Ich muss es einfach nur hinbekommen das ein Link zu einem Bild das Attribut rel=“lightbox“ bekommt ohne das ich es per Hand einfügen muss.
Link zu diesem Beitrag in die Zwischenablage kopieren
http://code.google.com/p/jqueryjs/downlo...2.6.min.js


beispiel ...

  1. <head>
  2. ...
  3.  
  4. <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
  5.  
  6. <script type="text/javascript">
  7. //<![CDATA[
  8. $(function(){$('#superdiv a').attr('rel','lightbox');});
  9. //]]>
  10. </script>
Quelltext in Zwischenablage kopieren

  1. <div id="superdiv"> <a ... >1</a> <a ... >2</a> </div>
Quelltext in Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
bzw., wenn auch nicht-bild-links im DIV vorkommen (also nur den '....jpg'-links 'rel' zuordnen):

(zeile 8, s.o.)
  1. $('#superdiv a[href$=".jpg"]').attr('rel','lightbox');
Quelltext in Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
Danke für die Mühe, aber das klappt bei mir noch nicht wirklich
Link zu diesem Beitrag in die Zwischenablage kopieren
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Unbenanntes Dokument</title>
  6. <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
  7.  
  8. <style type="text/css">
  9. <!--
  10. #superdiv {
  11. height: 400px;
  12. width: 400px;
  13. }
  14. -->
  15. </style>
  16. <script type="text/javascript">
  17. //<![CDATA[
  18. $('#superdiv a[href$=".jpg"]').attr('rel','lightbox');
  19. //]]>
  20. </script>
  21. </head>
  22.  
  23.  
  24. <body>
  25.  
  26. <div id="superdiv"><a href="images/bild2.jpg"><img src="images/header.jpg" width="990" height="68" border="0" /></a></div>
  27. </body>
  28. </html>
Quelltext in Zwischenablage kopieren

Das ist der Code der im Broweser erscheint. Korrigiert mich bitte wenn ich irgendwas falsch gemacht habe. Mit Javascript kenne ich mich mal überhaupt nicht aus. Normalerweise müsse ja das rel=“lightbox“ vor dem href stehen oder?
Link zu diesem Beitrag in die Zwischenablage kopieren
Wo das „rel“ im a-tag steht ist schonmal egal, weiter kann ich dir aber auch nicht helfen planlos
Link zu diesem Beitrag in die Zwischenablage kopieren
das jquery js hast du aber schon geladen?
Link zu diesem Beitrag in die Zwischenablage kopieren
ehhh...

zeile 18 wie folgt ersetzen, herr schumann ..
  1. $(function(){ $('#superdiv a[href$=".jpg"]').attr('rel','lightbox'); });
Quelltext in Zwischenablage kopieren

angezeigt wird das REL nicht (... im quelltext) - jedoch zugeteilt;
nur - wo ist die Lightbox-Applikation in deiner html-datei? - damit rel=“lighbox“ überhaupt
einen sinn ergibt ..
Link zu diesem Beitrag in die Zwischenablage kopieren
argh, also irgendwo ist da noch der Wurm drin http://www.lautleben.com/lightbox/

In dem unteren Bild habe ich das rel mal per Hand eingesetzt um zu schauen ob das Lightbox Script überhaupt geht.
Link zu diesem Beitrag in die Zwischenablage kopieren
so, hab jetzt was auf die schnelle gestrickt. aus bequemlichkeit mit jquery, dafür gibts auch ein angepasstes lightbox-script. auf der seite alles dokumentiert und zum download.

jquery + lightbox
Link zu diesem Beitrag in die Zwischenablage kopieren
Danke Jungs, das Script von Jonis hat funktioniert. Einen schönen Sonntag noch.
Link zu diesem Beitrag in die Zwischenablage kopieren
Jonis schrieb am 02.11.08, 19:15 Uhr:

so, hab jetzt was auf die schnelle gestrickt ...
...

  1. $('a[href$=".jpg"]').attr('rel','lightbox');
  2. $('a[@rel*=lightbox]').lightBox();
Quelltext in Zwischenablage kopieren

wozu der „rel“-umstand in diesem fall? planlos

  1. $('a[href$=".jpg"]').lightBox();
Quelltext in Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
weil das lightbox-script bei mehreren bildern wissen muss was sonst noch dazu gehört ...
Link zu diesem Beitrag in die Zwischenablage kopieren
Irrelevanter Beitrag (anzeigen):

Link zu diesem Beitrag in die Zwischenablage kopieren
#