Seiten Position des Kalenders nach anklicken
Hallo Zusammen!
ich habe einen Eventkalender eingebaut-funktioniert auch grundsätzlich.
Seitenaufbau von oben: Kopfzeile mit Kontaktdaten, Navigation, Bilderbanner, Bereichsüberschrift, Inhalte
Meine Fragen:
1. Klicke ich ein Event im Kalender an, zeigt mir der Eventleser auch den Termin an...der Kalender springt aber dann immer in den jetzigen Monat zurück.
Kann ich das ändern, das der Kalender in dem Monat bleibt, in dem der Termin ist?
2. Klicke ich einen Monat weiter im Kalender oder klicke ich einen Termin an, erzeugt contao immer eine neue Seite (zB.: mitgliederversammlung.html?month=201602), dadurch wird natürlich die Seite immer komplett neu aufgebaut und man muss zum Kalender runterscrollen. Kann ich irgendwie dafür sorgen, das die Seitenposition gleich bleibt und man nicht bei jedem Klick im Kalender wieder zum Kalender runterscrollen muss?
Vielen Dank für Hilfe vorab!
GLG
Vosi
Liste der Anhänge anzeigen (Anzahl: 1)
Kalender werden jetzt 3 mal generiert
Hallo,
ich würde das skript auch sehr gerne verwenden, nicht für den Minikalender, sonder für den Momatsübersichtskalender.
Doch nach dem Blättern (nicht beim ersten Aufruf) wird der Kalender jetzt 3 mal generiert.
Ansonsten ist das Skript funktionsfähig!
Was soll ich da machen?
Anhang 19741
KORREKTUR und Entwarnung
Nur wenn es einen weiteren Kalender auf dieser Seite gibt!
Wenn es nur einen gibt (eher der Normalfall :o ), dann ist alles Wunderbar!
Nachladen per Ajax: Konflikt mit tooltipster
Hallo zusammen
Ich nütze den Contao Kalender mit dem jquery plugin tooltipster und einem modifizierten Kalender-Template.
Es stellt sich ein Problem dar, wenn ich die Nachladefunktion per Ajax mit tooltipster kombiniere:
PHP-Code:
<!-- jquery tooltipster -->
<link rel="stylesheet" type="text/css" href="tooltipster/dist/css/tooltipster.bundle.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script type="text/javascript" src="tooltipster/dist/js/tooltipster.bundle.min.js"></script>
<script>
$(document).ready(function() {
$('.tooltip').tooltipster({
animation: 'fade',
contentAsHTML: true,
interactive: true,
trigger: 'custom',
triggerOpen: {
mouseenter: true,
tap: true
},
triggerClose: {
mouseleave: true,
tap: true
}
});
$('.mod_calendar').on('click', '.head a', function(e) {
e.preventDefault();
$('.mod_calendar').load( $(this).attr('href') + ' .mod_calendar > *' );
return false;
});
});
</script>
Die Nachladefunktion funktioniert tiptop (danke spooky!). Aber das hebelt das tooltipster aus. Egal ob ich die Nachladefunktion vor oder nach tooltipster innerhalb
PHP-Code:
$(document).ready(function() {
aufrufe. Dann funktioniert das tooltipster einfach nicht mehr.
tooltipster wird im Kalender-Template so aufgerufen:
PHP-Code:
<a class="tooltip"
title="<?php echo specialchars($event['teaser']);?>"
<span itemprop="name">
<?= $event['title'] ?><br><?= $event['time'] ?>
</span>
</a>
Wie müsste ich die Nachladefunktion abändern, dass die a.tooltip nicht beeinträchtigt werden?
(Für mich sieht es eigentlich nicht so aus, als ob sich die zwei jquery-funktionen irgendwo kreuzen...)
[gelöst] Kalender mit Tooltip und Nachladefunktion für Monatswechsel
Ah super! Dann muss das Tooltip sozusagen zweimal aufgerufen werden... ach so. Danke tausend, spooky!
Für alle, die das auch wollen:
Tooltipster hier herunterladen und ins root (Contao4 = /web) kopieren.
Dann folgendes script ins Template kopieren:
PHP-Code:
<link rel="stylesheet" type="text/css" href="tooltipster/dist/css/tooltipster.bundle.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script type="text/javascript" src="tooltipster/dist/js/tooltipster.bundle.min.js"></script>
<script>
$(document).ready(function() {
$('.tooltip').tooltipster({
animation: 'fade',
contentAsHTML: true,
interactive: true,
trigger: 'custom',
triggerOpen: {
mouseenter: true,
tap: true
},
triggerClose: {
mouseleave: true,
tap: true
}
});
$('.mod_calendar').on('click', '.head a', function(e) {
e.preventDefault();
$('.mod_calendar').load($(this).attr('href') + ' .mod_calendar > *', function()
{
$('.mod_calendar a.tooltip').tooltipster({
animation: 'fade',
contentAsHTML: true,
interactive: true,
trigger: 'custom',
triggerOpen: {
mouseenter: true,
tap: true
},
triggerClose: {
mouseleave: true,
tap: true
}
});
});
return false;
});
});
</script>
Kalender-Template (dabei wird, was in den Teasertext der Events geschrieben wird, als Tooltip genommen. Und mit specialchars() funktionieren auch links:
PHP-Code:
<table class="calendar">
<thead>
<tr>
<th colspan="2" class="head previous"><?php if ($this->prevHref): ?><a href="<?= $this->prevHref ?>" title="<?= $this->prevTitle ?>"><?= $this->prevLink ?></a><?php else: ?> <?php endif; ?></th>
<th colspan="3" class="head current"><?= $this->current ?></th>
<th colspan="2" class="head next"><?php if ($this->nextHref): ?><a href="<?= $this->nextHref ?>" title="<?= $this->nextTitle ?>"><?= $this->nextLink ?></a><?php else: ?> <?php endif; ?></th>
</tr>
<tr>
<?php foreach ($this->days as $i=>$day): ?>
<th class="label<?= $day['class'] ?>"><?= Patchwork\Utf8::substr($day['name'], 0, $this->substr) ?><span><?= Patchwork\Utf8::substr($day['name'], $this->substr) ?></span></th>
<?php endforeach; ?>
</tr>
</thead>
<tbody>
<?php foreach ($this->weeks as $class=>$week): ?>
<tr class="<?= $class ?>">
<?php foreach ($week as $day): ?>
<td class="<?= $day['class'] ?>">
<div class="header"><?= $day['label'] ?></div>
<?php foreach ($day['events'] as $event): ?>
<div class="event cal_<?= $event['parent'] ?><?= $event['class'] ?>" itemscope itemtype="http://schema.org/Event">
<a class="tooltip"
title="<?php echo specialchars($event['teaser']);?>"
<span itemprop="name">
<?= $event['title'] ?><br><?= $event['time'] ?>
</span>
</a>
</div>
<?php endforeach; ?>
</td>
<?php endforeach; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
