11 ноября 2012 в 8:49
подскажите пожалуйста, как подключить карусель для событий в календаре, т.е. когда в одном дне больше одного события...чтобы они скролировались автоматически, а не вставали один под другой, растягивая колонку дня?
модуль Calendar 7.3 вид месяц.
Комментарии
Слайдер подключила так:
1. в инфо файле подключила библиотеку scripts[]= js/jquery-1.7.2.min.js
2. в шаблоне календаря calendar-month-col.tpl.php написала следующие
/**
* @file
* Template to display a column
*
* - $item: The item to render within a td element.
*/
$id = (isset($item['id'])) ? 'id="' . $item['id'] . '" ' : '';
$date = (isset($item['date'])) ? ' data-date="' . $item['date'] . '" ' : '';
$day = (isset($item['day_of_month'])) ? ' data-day-of-month="' . $item['day_of_month'] . '" ' : '';
$headers = (isset($item['header_id'])) ? ' headers="'. $item['header_id'] .'" ' : '';
?>
<td <?php print $id?>class="<?php print $item['class'] ?>" colspan="<?php print $item['colspan'] ?>" rowspan="<?php print $item['rowspan'] ?>"<?php print $date . $headers . $day; ?>>
<div id="slider-wrap">
<div id="slider">
<?php print $item['entry'] ?>
</div>
</div>
</td>
<script>
var hwSlideSpeed = 700;
var hwTimeOut = 3000;
(function ($) {
$(document).ready(function(e) {
$('.slide').css(
{"position" : "absolute",
"top":'0', "left": '0'}).hide().eq(0).show();
var slideNum = 0;
var slideTime;
slideCount = $("#slider .slide").size();
var animSlide = function(arrow){
clearTimeout(slideTime);
$('.slide').eq(slideNum).slideUp(hwSlideSpeed);
if(arrow == "next"){
if(slideNum == (slideCount-1)){slideNum=0;}
else{slideNum++}
}
else if(arrow == "prew")
{
if(slideNum == 0){slideNum=slideCount-1;}
else{slideNum-=1}
}
else{
slideNum = arrow;
}
$('.slide').eq(slideNum).fadeIn(hwSlideSpeed, rotator);
$(".control-slide.active").removeClass("active");
$('.control-slide').eq(slideNum).addClass('active');
}
var pause = false;
var rotator = function(){
if(!pause){slideTime = setTimeout(function(){animSlide('next')}, hwTimeOut);}
}
$('.slide').hover(
function(){clearTimeout(slideTime); pause = true;},
function(){pause = false; rotator();
});
rotator();
});
})(jQuery);
</script>
4. в шаблоне содержимого дня календаря calendar-item.tpl.php
<?php print theme('calendar_stripe_stripe', array('item' => $item)); ?>
<?php foreach ($rendered_fields as $field): ?>
<?php print $field; ?>
<?php endforeach; ?>
</div>
5. очистила кеш
слайдер заработал ))
есть вопрос:
Что и где прописать..чтобы если..в дне одно событие...слайдер не крутился? и как сделать чтобы не было белого промежутка между событиями?
сейчас он прокручивает события (одно или несколько, смотря сколько их в дне) потом идет белое поле..потом снова события.