Lupe auf Bild

  • 0 x
    31 Beiträge
    0 Hilfreiche Beiträge
    20. 12. 2010, 15:31

    Hallo zusammen,

    ich weiß, dass das Thema schon oft diskutiert wurde, aber ich stehe grad bei meiner Lösung etwas auf dem Schlauch. Bisher bekomme ich die Lupe auf das Bild:

    1. tt_content.image.20 {
    2. 1 {
    3. |<div class="lupe"><a href="HIER MUSS NOCH WAS HIN" class="group"><img src="fileadmin/images/icons/lupe.png" alt="" title="" /></a></div>
    4. )
    5. if.isTrue.field = image_zoom
    6. ifEmpty.field = image_link
    7. }
    8. }
    9. }

    Wie bekomme ich jetzt bei dem href="HIER MUSS NOCH WAS HIN" den Pfad zum dem Originalbild hin? Ich weiß das es TSFE:lastImageInfo|origFile gibt. Aber wenn ich das da rein setze, dann funktioniert das nicht, weil dann ja zwei | dabei sind.

    Gruß
    Stefan


  • 1
  • 0 x
    31 Beiträge
    0 Hilfreiche Beiträge
    20. 12. 2010, 19:23

    So die Lösung ist gefunden:

    1. tt_content.image.20 {
    2. 1 {
    3. 10 = TEXT
    4. 10.value = |
    5. 20 = TEXT
    6. 20.data = TSFE:lastImageInfo|origFile
    7. 20.wrap = <div class="lupe"><a href="|" class="group"
    8. 30 = TEXT
    9. 30.data = field:uid
    10. 30.wrap = rel="sb|"
    11. 40 = TEXT
    12. 40.value = ><img src="fileadmin/images/icons/lupe.png" alt="" title="" /></a></div>
    13. }
    14. if.isTrue.field = image_zoom
    15. ifEmpty.field = image_link
    16. }
    17. }
    18. }

  • ISS ISS
    Padawan
    0 x
    50 Beiträge
    0 Hilfreiche Beiträge
    21. 12. 2010, 08:25

    Hallo bravestar

    Danke das du die Lösung mitgeteilt hast.
    Jetzt müsstest du nur noch auf Gelöst umschalten ;)

    Gruss,
    ISS

  • stevee stevee
    R2-D2
    0 x
    107 Beiträge
    0 Hilfreiche Beiträge
    12. 03. 2011, 20:48

    Hallo bravestar, hallo zusammen

    Ich möchte das Script so ähnlich auch bei mir einsetzen.
    Praktisch daran ist, dass man damit kein JavaScript braucht, wie z.B. hier:
    [url=]www.elemente-websolutions.ms/blog/2009/02/06/typo3-klick-vergrosern-mit-lupensymbol/[/url]

    hier zuerstmal mein TS-Setup:

    1. tt_content.image.20.1 {
    2. 10 = TEXT
    3. 10.value = |
    4. 20 = TEXT
    5. 20.data = TSFE:lastImageInfo|origFile
    6. 20.wrap = <a class="fancybox" href="|" style="display: block; margin-top: -39px; margin-bottom: 0px; padding-right: 2px; text-align: right; text-decoration: none;"
    7. 30 = TEXT
    8. 30.data = field:uid
    9. 30.wrap = rel="fancybox|"
    10. 40 = TEXT
    11. 40.value = ><img src="fileadmin/images/icons/Lupe2_18x18.png" alt="Klicken, um Bild zu vergr&ouml;ssern" title="Klicken, um Bild zu vergr&ouml;ssern" style="margin-bottom: 0px;"/></a>
    12. }
    13. if.isTrue.field = image_zoom
    14. ifEmpty.field = image_link
    15. }
    16. }

    Grundsätzlich würde das alles funktionieren, ABER mit meiner Lightbox gibt es ein Problem, und zwar werden die Bilder DOPPELT angezeigt in der Lightbox.
    Und zwar nehme ich an, weil es dann zwei mal das Element gibt, was die Eigenschaft "rel="fancyboxZahl" hat.

    Lightbox ist dies hier:
    [url=]www.typo3.org/extensions/repository/view/sk_fancybox/current/[/url]

    Passiert das bei Dir nicht, bei Deiner eingesetzten Lightbox?
    (An den Buchstaben sb muss dass eine Slimbox sein...?)

    Ich habs jetzt provisorisch mal so gelöst:

    1. tt_content.image.20.1 {
    2. stdWrap.innerWrap2 =|<div style="height: 20px; width: 20px; margin-top: -39px; margin-bottom: 0px; padding-left: 2px; position: relative; display: block; background-image: url(/fileadmin/images/icons/Lupe2_18x18.png); background-position: left; background-repeat: no-repeat; cursor: pointer;"></div>
    3. if.isTrue.field = image_zoom
    4. if.isFalse.field = image_link
    5. }
    6. }

    Hier seht ihr auch die Demo-Seite:
    [url=]www.lu-wahlen.ch/index.php?id=41[/url]
    Es ist das Bild gaaaanz unten links (Pascal Merz).

    Wie Ihr seht ist hier jetzt kein Link gesetzt und die Lupe als Hintergrundbild definiert.
    Aber wenn man mit der Maus über die Lupe fährt wirkt leider der Link vom Bild darunter nicht mehr, daher ist das auch keine super Lösung...

    Habt Ihr eine gute Lösung?

    Danke für Eure Hilfe
    Stevee

  • 1