Ich habe mir mal einen kleinen Infobereich gebastelt und bin etwas verwundert. Am Rechner lief alles und im Shop nicht.
Das ganze läuft mit js.
Als ich es einbaute, funktionierte alles ganz gut, bis auf die Anzeige des Buttons. Wo ich ihn auch hinlegte und verlinkte, er wurde nicht angezeigt. Google sagte dann, dass der Link in den Ordner css/images/ führt, den es aber gar nicht gibt. Gut, kann man anlegen. Jetzt wird der Button angezeigt und wenn ich ihn benutze, öffnet sich die Startseite. Man kann auch einfach in das Feld klicken/tippen, dann öffnet sie sich nicht. beim Schließen das Gleiche.
Der Code hierfür sieht wie folgt aus.
die css dazu:
Woran könnte es liegen und was müsste ich ändern?
Vielen Dank.
Das ganze läuft mit js.
Als ich es einbaute, funktionierte alles ganz gut, bis auf die Anzeige des Buttons. Wo ich ihn auch hinlegte und verlinkte, er wurde nicht angezeigt. Google sagte dann, dass der Link in den Ordner css/images/ führt, den es aber gar nicht gibt. Gut, kann man anlegen. Jetzt wird der Button angezeigt und wenn ich ihn benutze, öffnet sich die Startseite. Man kann auch einfach in das Feld klicken/tippen, dann öffnet sie sich nicht. beim Schließen das Gleiche.
Der Code hierfür sieht wie folgt aus.
Code:
<div id="InformationCharts" class="InformationCharts"> <dl> <dt><?php echo BOX_INFORMATION_COLORCHART ?> <a href="#" id="button" class="closed">Details</a></dt> <dd> Hier sind viele Bilder, die ich wegen der Übersichtlichkeit entfernte. </dd> <dt><?php echo BOX_INFORMATION_MEASUREMENT_CHART ?><a href="#" id="button" class="closed">Details</a></dt> <dd><h5>Damen Ladies</h5></br><a class="MagicZoom" id="zoom" data-options="zoomMode: off" title="Measurement Chart" href="images/measurement_chart/latex_groessentabelle_damen.jpg"><img src="images/measurement_chart/latex_groessentabelle_damen.jpg"/></a></br><br class="clearBoth"><h5>Herren Gentlemen</h5></br> <a class="MagicZoom" id="zoom" data-options="zoomMode: off" title="..." href="images/measurement_chart/latex_groessentabelle_herren.jpg"><img src="images/measurement_chart/latex_groessentabelle_herren.jpg"/></a> <br class="clearBoth"> </dd> <dt class="dt-last"><?php echo BOX_INFORMATION_MEASUREMENTS_FORM ?> <a href="#" id="button" class="closed">Details</a></dt> <dd class="dd-last"><img src="images/measurementsform/amatoris-massblatt-de600x849.jpg" alt="Maßblatt"></br><h5>Downloads</h5></br><a href="download/amatoris-massblatt-de.pdf" type="application/octet-stream">PDF</a><a href="download/amatoris-massblatt-de.jpg" type="application/octet-stream">JPG</a></dd> </dl> <script type="text/javascript"> $(document).ready(function(){ $("dt").click(function(){ $('dd').slideUp("fast"); $('dt > a').removeClass('open').addClass("closed"); $(this).next("dd").slideDown("fast"); $(this).children("a").removeClass('closed').addClass("open"); }); }); </script> </div>
Code:
#InformationCharts { width:100%; margin: 40px 0 40px 0; } #InformationCharts dt { font-weight:bold; float:left; width:100%; padding:10px 10px 10px 10px; border-top:1px solid #bcc2d1; cursor:pointer; color:#586482; } .dt-last{ font-weight:bold; float:left; width:100%; padding:10px 10px 10px 10px; border-top:1px solid #bcc2d1; border-bottom:1px solid #bcc2d1; cursor:pointer; color:#586482; } .InformationCharts dt:hover { color:#586482; } .InformationCharts dd { display:none; margin:0 0 15px 0; float:left; width:100%; text-align: center; } .dd-last { display:none; margin:0 0 15px 0; float:left; width:100%; padding-bottom: 20px; border-bottom:1px solid #bcc2d1; text-align: center; } .InformationCharts dd img{ margin-bottom: 10px; } .dd-last a{ margin: 20px 20px 20px 20px; padding:10px 20px 10px 20px; border: 1px solid #bcc2d1; background-color: #e9ebf0; } .dd-last a:hover{ margin: 20px 20px 20px 20px; padding:10px 20px 10px 20px; border: 1px solid #bcc2d1; background-color: #cbcfdb; } .InformationCharts #button { float:right; display:block; height:18px; width:17px; text-indent:-9999px; } #InformationCharts .closed { background:url(images/button.png) left no-repeat; } #InformationCharts .open { background:url(images/button.png) right no-repeat; }
Woran könnte es liegen und was müsste ich ändern?
Vielen Dank.
Kommentar