# \[gelöst\] Artikel vergleichen im Template versetzen

**URL:** <https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750>\
**Category:** Shopware 3.5\
**Tags:** templates--design\
**Created:** [19. November 2010 um 07:40 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750 "2010-11-19T07:40:38Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 07:40 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/1 "2010-11-19T07:40:38Z")

</div>

Hallo, ich habe den Button “Artikel vergleich”, welcher oben im Header erscheint, versetzt. ` #compareHighlight { border:0 none; color:#FFFFFF; left:210px; top:4px; } ` Leider erscheint das zugehörige DropDown-Menü noch auf der alten Position. Über Firebug kann ich die passende Stelle nicht lokalisieren. Könnt ihr mir sagen, wie ich das Menü unter meine neue Position bekomme? EDIT: Habe es nun gefunden: ` #compareContainerResults { } ` Jetzt fehlt mir nur noch der Hover-Bereich, diesen habe ich noch nicht gefunden 😕

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 07:55 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/2 "2010-11-19T07:55:52Z")

</div>

Hab was im Code gefunden: [code]

onmouseout="…" onmouseover="…" [/code] Aber wie formatiere ich nun „onmouseover“ ?

---

<div class="post-metadata">

**Author:** ![Stefan\_Hamann](https://avatars.discourse-cdn.com/v4/letter/s/5e9695/32.png) [@Stefan\_Hamann](https://forum.shopware.com/u/Stefan_Hamann)\
**Post date:** [19. November 2010 um 08:40 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/3 "2010-11-19T08:40:09Z")

</div>

Moin, schau auch mal in die jquery.shopware.js - einige Styles in Sachen Compare-Box werden auch dort gesetzt!

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 09:15 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/4 "2010-11-19T09:15:02Z")

</div>

[quote=„Stefan Hamann“]Moin, schau auch mal in die jquery.shopware.js - einige Styles in Sachen Compare-Box werden auch dort gesetzt![/quote] Mhhh, ich blicks nicht 😕 Hab dies gefunden. Evtl. ist das die richtige Stelle: ` //Default options $.compare.options = { viewportAjax: '', compareContainer: '#compare\_bigbox', compareOverlay: '#lbOverlay', resultsContainer: '#compareContainerResults', ajaxContainer: '#compareContainerAjax', compareHighlight: '#compareHighlight', highlightSpeed: 1750, highlightColor: '#dd4800', dataType: 'json', requestType: 'post', animationSpeed: 400, topLink: '#top', maxCount: 5, compareCount: 0 }; ` Mein Problem ist, dass beim Mausover einen schwarzen Border angezeigt wird und die Schrift schwarz wird. Das würde ich gerne ändern.

---

<div class="post-metadata">

**Author:** ![Stefan\_Hamann](https://avatars.discourse-cdn.com/v4/letter/s/5e9695/32.png) [@Stefan\_Hamann](https://forum.shopware.com/u/Stefan_Hamann)\
**Post date:** [19. November 2010 um 09:51 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/5 "2010-11-19T09:51:41Z")

</div>

Kann man sich das irgendwo live ansehen?

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 09:54 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/6 "2010-11-19T09:54:47Z")

</div>

Du hast eine PN 😉

---

<div class="post-metadata">

**Author:** ![Stefan\_Hamann](https://avatars.discourse-cdn.com/v4/letter/s/5e9695/32.png) [@Stefan\_Hamann](https://forum.shopware.com/u/Stefan_Hamann)\
**Post date:** [19. November 2010 um 09:59 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/7 "2010-11-19T09:59:25Z")

</div>

Das liegt an a:focus, a:hover { color:#ffffff; text-decoration:underline; font-weight:bold; } in tutorial.css (Zeile 584) Das bezieht sich damit ja auf alle Links - also du kannst z.B. darunter .bt\_compare compare\_get\_overlay a:hover { color:#000; } schreiben

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 10:06 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/8 "2010-11-19T10:06:12Z")

</div>

mhhh, das ist ja von mir und so hätte ich es gerne. Aber beim „Vergleichen“ kommt es nicht zum Tragen. ` a:focus, a:hover { color:#ffffff; text-decoration:underline; font-weight:bold; } ` Bei „Mein Konto“ und „Merkzettel“ ist die Schrift ja weiß, underline und bold. Aber eben bei „Vergleichen“ nicht!

---

<div class="post-metadata">

**Author:** ![Stefan\_Hamann](https://avatars.discourse-cdn.com/v4/letter/s/5e9695/32.png) [@Stefan\_Hamann](https://forum.shopware.com/u/Stefan_Hamann)\
**Post date:** [19. November 2010 um 10:08 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/9 "2010-11-19T10:08:09Z")

</div>

Du meinst doch den Mouse-Over bei Vergleich starten, oder? Der ist bei mir weiß?

---

<div class="post-metadata">

**Author:** ![Snooops](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@Snooops](https://forum.shopware.com/u/Snooops)\
**Post date:** [19. November 2010 um 10:20 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/10 "2010-11-19T10:20:15Z")

</div>

```auto
 span#compareHighlight{ color: #ffffff; }
```

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 10:52 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/11 "2010-11-19T10:52:19Z")

</div>

Nein, es ist schwarz 😉 Irgendwie reden wir aneinander vorbei. Bild: [http://www.myimg.de/?img=Bildbab94.jpg](http://www.myimg.de/?img=Bildbab94.jpg) Der Code bringt auch nichts: `span#compareHighlight{ color: #ffffff; }`

---

<div class="post-metadata">

**Author:** ![Snooops](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@Snooops](https://forum.shopware.com/u/Snooops)\
**Post date:** [19. November 2010 um 13:28 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/12 "2010-11-19T13:28:26Z")

</div>

Du musst den Code am ende deiner CSS setzen und dann wird der Text „Artikel vergleichen“ weiß… also das ist definitiv so, hab das jetzt bei 4 verschiedenen designs ausprobiert… Ansonsten Firebug (Firefox Addon) installieren und dann rechts klick auf den Text -\> Element untersuchen und dann kannst du sehen welche Eigenschaften aus welcher Datei geladen werden. Gruß der Snooops

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 13:45 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/13 "2010-11-19T13:45:15Z")

</div>

Nein. Bei mir ging es definitv nicht 😉 Aber ich habe es nun raus. .active musste noch sein. Ohne dieses ACTIVE wird es mein Mouseover nicht angewandt. ` span#compareHighlight.active{ color: #ffffff; border:0 none; } `

---

<div class="post-metadata">

**Author:** ![avenger](https://avatars.discourse-cdn.com/v4/letter/a/9de0a6/32.png) [@avenger](https://forum.shopware.com/u/avenger)\
**Post date:** [19. November 2010 um 14:00 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/14 "2010-11-19T14:00:47Z")

</div>

[quote=„ottscho“]Nein. Bei mir ging es definitv nicht 😉 Aber ich habe es nun raus. .active musste noch sein. Ohne dieses ACTIVE wird es mein Mouseover nicht angewandt. ` span#compareHighlight.active{ color: #ffffff; border:0 none; } `[/quote] Der politisch Korrekte Selektor für „Mouseover“ ist „hover“, nicht „active“… 🕶

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 14:34 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/15 "2010-11-19T14:34:50Z")

</div>

Oh man, ich verzeifel noch an dem CSS für diese Box. Habe nun folgendes: ` #compareHighlight { border:0 none; color:#FFFFFF; left:210px; top:4px; } #compareContainerResults { left:210px; top:32px; color:#000000; } #compareContainerResults a:hover { left:210px; top:32px; color:#000000; text-decoration:underline; } span#compareHighlight.active{ color: #ffffff; border:0 none; } ` Demoshop: [http://www.panasiatica.de/shop/](http://www.panasiatica.de/shop/) 1.) Der Hover wird an der original Stelle eingeblendet 2.) Das DropDown verhält sich komisch. Man kommt kaum runter zum anklicken.

---

<div class="post-metadata">

**Author:** ![Snooops](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@Snooops](https://forum.shopware.com/u/Snooops)\
**Post date:** [19. November 2010 um 17:33 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/16 "2010-11-19T17:33:22Z")

</div>

top: 30px ist hier der Trick. tutorial.css (Zeile 668) `#compareContainerResults { color:#000000; left:210px; top:30px; }`

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [19. November 2010 um 20:28 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/17 "2010-11-19T20:28:25Z")

</div>

Und was hat sich jetzt geändert? Der compareContainerResults sitzt 2px weiter oben. Aber fahre mal mit der Maus über „Vergleich starten“ oder „Vergleich löschen“, dann erscheint der schwarze Hover-Effekt rechts daneben, an der original Position. Und nicht an der gewünschten Stelle…

---

<div class="post-metadata">

**Author:** ![ottscho](https://avatars.discourse-cdn.com/v4/letter/o/7ba0ec/32.png) [@ottscho](https://forum.shopware.com/u/ottscho)\
**Post date:** [22. November 2010 um 08:09 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/18 "2010-11-22T08:09:33Z")

</div>

edit. hat sich erledigt 😉

---

<div class="post-metadata">

**Author:** ![hifibau](https://avatars.discourse-cdn.com/v4/letter/h/d9b06d/32.png) [@hifibau](https://forum.shopware.com/u/hifibau)\
**Post date:** [3. September 2013 um 21:15 UTC](https://forum.shopware.com/t/gelost-artikel-vergleichen-im-template-versetzen/750/19 "2013-09-03T21:15:29Z")

</div>

[quote=“ottscho”]edit. hat sich erledigt ;)[/quote] [quote]Leider erscheint das zugehörige DropDown-Menü noch auf der alten Position.[/quote] genau das Problem habe ich auch…kannst Du mir bitte sagen wie und wo Du genau das hin bekommen hast. Ich habe immer noch das selbe Problem das ich die DropDown-Menübox nicht Positionsmäßig versetzt bekomme. ☹