Hallo,
bin über den Blog von cc13.com auf den Datepicker von jQuery aufmerksam geworden. Echt ein ganz feine Sache!
Zur Verdeutlichung, siehe: [
jqueryui.com]
Möchte das dritte Theme von oben (oben rechts, die kleine Auswahl) namens "Smoothness" verwenden.
So weit funktioniert das auch wie es soll, es gibt nur ein Problem: Ich kann partout die für das Theme erforderlichen Images nicht einbinden. Z.B. die kleinen Pfeile oben links und rechts, um zwischen den Monaten zu wechseln.
Ich habe als Übeltäter die ui.theme.css ausmachen können. Referenziere ich die im Header der Seite direkt auf die ui.theme.css von der Beispielseite, dann funktioniert alles tadelos.
So habe ich es eingebunden: (funktioniert nicht, keine Images werden angezeigt)
<link type="text/css" href="#WORKSPACE_IMAGES#ui.theme.css" rel="stylesheet" />
<link type="text/css" href="#WORKSPACE_IMAGES#ui.core.css" rel="stylesheet" />
<link type="text/css" href="#WORKSPACE_IMAGES#ui.datepicker.css" rel="stylesheet" />
<script type="text/javascript" src="#WORKSPACE_IMAGES#jquery-1.3.2.js"></script>
<script type="text/javascript" src="#WORKSPACE_IMAGES#ui.core.js"></script>
<script type="text/javascript" src="#WORKSPACE_IMAGES#ui.datepicker.js"></script>
So funktioniert es: (nur den Link in der ersten Zeile geändert)
<link type="text/css" href="[
jquery-ui.googlecode.com]; rel="stylesheet" />
<link type="text/css" href="#WORKSPACE_IMAGES#ui.core.css" rel="stylesheet" />
...
Die Bilder liegen alle im #WORKSPACE_IMAGES#-Verzeichnis, ein Testaufruf über den Seitenbody als normales Bild funktioniert ebenfalls.
Ich habe die ui.theme.css entsprechend angepasst, um die richtigen Pfade der Images zu verwenden, Beispiel:
Originalversion:
/* Icons
----------------------------------*/
/* states and images */
.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
...
Von mir angepasst:
/* Icons
----------------------------------*/
/* states and images */
.ui-icon { width: 16px; height: 16px; background-image: url(#WORKSPACE_IMAGES#ui-icons_222222_256x240.png)/*{iconsContent}*/; }
.ui-widget-content .ui-icon {background-image: url(#WORKSPACE_IMAGES#ui-icons_222222_256x240.png)/*{iconsContent}*/; }
...
Der Eintrag ist jetzt ziemlich lang geworden, dafür möchte ich mich entschuldigen. Hoffe mir kann jemand helfen.
Habe ich etwas übersehen?
Viele Grüße
Christian