<?php
use Twig\Environment;
use Twig\Error\LoaderError;
use Twig\Error\RuntimeError;
use Twig\Extension\SandboxExtension;
use Twig\Markup;
use Twig\Sandbox\SecurityError;
use Twig\Sandbox\SecurityNotAllowedTagError;
use Twig\Sandbox\SecurityNotAllowedFilterError;
use Twig\Sandbox\SecurityNotAllowedFunctionError;
use Twig\Source;
use Twig\Template;
/* index.twig */
class __TwigTemplate_b2797e06df71b66f3cfaaf29a14770c4 extends \Eccube\Twig\Template
{
private $source;
private $macros = [];
public function __construct(Environment $env)
{
parent::__construct($env);
$this->source = $this->getSourceContext();
$this->blocks = [
'stylesheet' => [$this, 'block_stylesheet'],
'javascript' => [$this, 'block_javascript'],
'main' => [$this, 'block_main'],
];
$this->sandbox = $this->env->getExtension('\Twig\Extension\SandboxExtension');
$this->checkSecurity();
}
protected function doGetParent(array $context)
{
// line 11
return "default_frame.twig";
}
protected function doDisplay(array $context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "index.twig"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "index.twig"));
// line 13
$context["body_class"] = "front_page";
// line 15
$context["NewsList"] = twig_get_attribute($this->env, $this->source, $this->env->getFunction('repository')->getCallable()("Eccube\\Entity\\News"), "getList", [], "method", false, false, true, 15);
// line 11
$this->parent = $this->loadTemplate("default_frame.twig", "index.twig", 11);
$this->parent->display($context, array_merge($this->blocks, $blocks));
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
}
// line 18
public function block_stylesheet($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheet"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheet"));
// line 19
echo " <style>
.slick-slider{
height:100%;
width: 100%;
overflow: hidden;
}
.main_visual.slick-slider .slick-list,
.main_visual.slick-slider .slick-track,
.main_visual.slick-slider .slick-slide,
.main_visual.slick-slider .slick-track > .slick-slide > div,
.main_visual.slick-slider .slick-slide img{
height:100%;
}
.main_visual.slick-slider .slick-slide{
overflow:hidden;
}
\t\t\t\t.main_visual.slick-slider .slick-cloned img,
.main_visual.slick-slider .slick-slide img{
opacity:0.8;
\t\t\t\t\tscale: 1.7;
\t\t\t\t\ttranslate: -5% 0;
\t margin-left:auto;
transition: scale 6.5s cubic-bezier(0.1, 1, 0.2, 1) , translate 6.5s;
}
.main_visual.slick-slider:before {
background: rgba(60, 20, 0, .2);
content: '';
display: block;
height: 100%;
left: 0;
opacity: .6;
position: absolute;
top: 0;
width: 100%;
z-index: 10;
}
.main_visual.slick-slider:after {
background: linear-gradient(217deg, rgba(110, 72, 51, .6), rgba(255, 0, 0, 0) 70.71%), linear-gradient(127deg, rgba(241, 234, 230, .6), rgba(0, 255, 0, 0) 70.71%), linear-gradient(336deg, rgba(249, 247, 245, .6), rgba(0, 0, 255, 0) 70.71%);
content: '';
display: block;
height: 100%;
left: 0;
opacity: .6;
position: absolute;
top: 0;
width: 100%;
z-index: 5;
}
.slick-slide{
position:relative;
}
/* ¥Æ¥¥¹¥È¤Î¥Õ¥§©`¥É¥¤¥ó¤È¥¹¥é¥¤¥É¥¤¥ó */
.main {
opacity: 0;
transform: translateX(10vw); /* ÓÒ¤«¤é¥¹¥é¥¤¥É¥¤¥ó */
transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.sub {
opacity: 0;
transform: translateX(10vw); /* ÓÒ¤«¤é¥¹¥é¥¤¥É¥¤¥ó */
transition: opacity 0.5s ease-in-out 0.3s, transform 0.5s ease-in-out 0.2s; /* 0.2ÃëßW¤ì */
}
.fade-in .main {
opacity: 1;
transform: translateX(0); /* Ôª¤ÎλÖäˑø¤ë */
}
.fade-in .sub {
opacity: 1;
transform: translateX(0); /* Ôª¤ÎλÖäˑø¤ë */
}
/* ±³¾°»Ïñ¤ÎÔO¶¨ */
.slick-slide {
overflow:hidden;
}
@-webkit-keyframes fadezoom {
0% {
transform: scale(1);
}
100% {
transform: scale(1.25);
}
}
@keyframes fadezoom {
0% {
transform: scale(1);
}
100% {
transform: scale(1.25);
}
}
.slick-animation {
\t\t\tscale: 1.1 !important;
\t\t\ttranslate: 5% 0 !important;
/* animation: fadezoom 20s linear 0s normal both; */
}
</style>
";
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
}
// line 134
public function block_javascript($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascript"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascript"));
// line 135
echo "
<script>
\t\t\t\$(function() {
\t\t\t\t// ¥á¥¤¥ó¥¹¥é¥¤¥À©`¤Î³õÆÚ»¯•r¤Î¥¤¥Ù¥ó¥È
\t\t\t \$('.main_visual').on('init', function () {
\t\t\t // ×î³õ¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$('.main_visual .slick-slide[data-slick-index=\"0\"] img').addClass('slick-animation');
\t\t\t });
\t\t\t // ¥á¥¤¥ó¥¹¥é¥¤¥À©`¤ÎÔO¶¨
\t\t\t \$('.main_visual').slick({
\t\t\t autoplay: true, // ×Ô„ÓÔÙÉú
\t\t\t infinite: true, // ŸoÏÞ¥ë©`¥×
\t\t\t slidesToShow: 1, // 1¤Ä¤Î¥¹¥é¥¤¥É¤ò±íʾ
\t\t\t slidesToScroll: 1, // ¥¹¥é¥¤¥É¤ò1¤Ä¤º¤Ä¥¹¥¯¥í©`¥ë
\t\t\t arrows: false, // ʸӡ¤ò·Ç±íʾ
\t\t\t speed: 2000, // ¥Õ¥§©`¥É¥¢¥Ë¥á©`¥·¥ç¥ó¤ÎËÙ¶È
\t\t\t autoplaySpeed: 5000, // ¥¹¥é¥¤¥É¤¬ÇФêÌæ¤ï¤ëég¸ô
\t\t\t pauseOnFocus: false, // ¥Õ¥©©`¥«¥¹•r¤Ë¥¹¥é¥¤¥É¤òÒ»•rÍ£Ö¹¤·¤Ê¤¤
\t\t\t pauseOnHover: false, // ¥Û¥Ð©`•r¤Ë¥¹¥é¥¤¥É¤òÒ»•rÍ£Ö¹¤·¤Ê¤¤
\t\t\t asNavFor: '.text_slider' // .text_slider ¤ÈͬÆÚ
\t\t\t })
\t\t\t .on({
\t\t\t beforeChange: function(event, slick, currentSlide, nextSlide) {
\t\t\t // ¤¹¤Ù¤Æ¤Î¥¹¥é¥¤¥É¤Î¥¢¥Ë¥á©`¥·¥ç¥ó¤ò¥ê¥»¥Ã¥È
\t\t\t \$(\".main_visual .slick-slide img\").removeClass(\"slick-animation\");
\t\t\t // ´Î¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$(\".main_visual .slick-slide[data-slick-index='\" + nextSlide + \"'] img\").addClass(\"slick-animation\");
\t\t\t // ´Î¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$(\".main_visual .slick-cloned img\").addClass(\"slick-animation\");
\t\t\t },
\t\t\t afterChange: function(event, slick, currentSlide) {
\t\t\t // Ç°¤Î¥¹¥é¥¤¥É¤Î¥¤¥ó¥Ç¥Ã¥¯¥¹¤òÓ‹Ëã
\t\t\t var prevSlide = (currentSlide === 0) ? slick.slideCount - 1 : currentSlide - 1;
\t\t\t // Ç°¤Î¥¹¥é¥¤¥É¤Î¥¢¥Ë¥á©`¥·¥ç¥ó¤ò¥ê¥»¥Ã¥È
\t\t\t \$(\".main_visual .slick-slide[data-slick-index='\" + prevSlide + \"'] img\").removeClass(\"slick-animation\");
\t\t\t \$(\".main_visual .slick-cloned img\").removeClass(\"slick-animation\");
\t\t\t }
\t\t\t });
// ¥Æ¥¥¹¥È¥¹¥é¥¤¥À©`¤Î³õÆÚ»¯•r¤Î¥¤¥Ù¥ó¥È
\$('.text_slider').on('init', function () {
// ×î³õ¤Î¥¹¥é¥¤¥É¤Ë 'fade-in' ¥¯¥é¥¹¤òßmÓÃ
\$('.slick-slide[data-slick-index=\"0\"]').addClass('fade-in');
});
// ¥Æ¥¥¹¥È¥¹¥é¥¤¥À©`¤ÎÔO¶¨£¨¥á¥¤¥ó¥¹¥é¥¤¥À©`¤ÈͬÆÚ£©
\$('.text_slider').slick({
autoplay: true, // ×Ô„ÓÔÙÉú
infinite: true, // ŸoÏÞ¥ë©`¥×
slidesToShow: 1, // 1¤Ä¤Î¥¹¥é¥¤¥É¤ò±íʾ
slidesToScroll: 1, // ¥¹¥é¥¤¥É¤ò1¤Ä¤º¤Ä¥¹¥¯¥í©`¥ë
fade: true,
speed: 1000,
autoplaySpeed: 5000,
arrows: false,
pauseOnFocus: false,
pauseOnHover: false,
pauseOnDotsHover: false,
asNavFor: '.main_visual' // .main_visual ¤ÈͬÆÚ
})
.on({
beforeChange: function(event, slick, currentSlide, nextSlide) {
// ´Î¤Î¥¹¥é¥¤¥É¤Ë 'fade-in' ¥¯¥é¥¹¤ò×·¼Ó
\$(\".text_slider .slick-slide[data-slick-index='\" + nextSlide + \"']\").addClass(\"fade-in\");
},
afterChange: function(event, slick, currentSlide) {
// ¬FÔڤΥ¹¥é¥¤¥ÉÒÔÍâ¤Î¤¹¤Ù¤Æ¤Î¥¹¥é¥¤¥É¤«¤é 'fade-in' ¥¯¥é¥¹¤òÏ÷³ý
\$(\".text_slider .slick-slide\").not(\"[data-slick-index='\" + currentSlide + \"']\").not(\".slick-cloned\").removeClass(\"fade-in\");
// ¬FÔڤΥ¹¥é¥¤¥É¤Ë¥¯¥é¥¹¤ò´_Œg¤Ë×·¼Ó
\$(\".text_slider .slick-slide[data-slick-index='\" + currentSlide + \"']\").addClass(\"fade-in\");
}
});
});
\$(function() {
\$('.topic_slider').slick({
vertical: true,
autoplay: true,
autoplaySpeed: 3800,
speed: 800,
arrows: true,
pauseOnFocus: false,
pauseOnHover: false,
pauseOnDotsHover: false
});
\$('.ec-sliderRole__news').each(function() {
var listLength = \$(this).find('.ec-sliderRole__newsItem').length;
if (listLength > 5) {
\$(this).find('.ec-sliderRole__newsItem:gt(4)').each(function() {
\$(this).hide();
});
\$(this).append('<a id=\"news_readmore\" class=\"ec-inlineBtn--top\">";
// line 237
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans("more"), "html", null, true);
echo "</a>');
var dispNum = 5;
\$(this).find('#news_readmore').click(function() {
dispNum += 5;
\$(this).parent().find('.ec-sliderRole__newsItem:lt(' + dispNum + ')').show();
if (dispNum >= listLength) {
\$(this).hide();
}
})
}
});
});
</script>
";
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
}
// line 253
public function block_main($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "main"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "main"));
// line 254
echo " <div class=\"ec-sliderRole\">
<div class=\"ec-sliderRole__wrap\">
<div class=\"mv__wrap\">
<div class=\"main_visual\">
<div class=\"item slick-slide\">
<img src=\"";
// line 260
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("assets/img/top/01.jpg"), "html", null, true);
echo "\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"";
// line 263
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("assets/img/top/02.jpg"), "html", null, true);
echo "\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"";
// line 266
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("assets/img/top/03.jpg"), "html", null, true);
echo "\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"";
// line 269
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("assets/img/top/04.jpg"), "html", null, true);
echo "\" class=\"outset\">
</div>
</div>
<div class=\"text_slider\">
<div class=\"ec-sliderRole__title\">
<div class=\"main\">Lillie and</div>
<div class=\"sub\">Garcello</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">ORIGINAL</div>
<div class=\"sub\">GOODS</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">SELECT</div>
<div class=\"sub\">SHOP</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">RECOMMENDED</div>
<div class=\"sub\">ITEM</div>
</div>
</div>
</div>
<div class=\"ec-sliderRole__news topic_slider\">
";
// line 296
$context['_parent'] = $context;
$context['_seq'] = twig_ensure_traversable((isset($context["NewsList"]) || array_key_exists("NewsList", $context) ? $context["NewsList"] : (function () { throw new RuntimeError('Variable "NewsList" does not exist.', 296, $this->source); })()));
foreach ($context['_seq'] as $context["_key"] => $context["News"]) {
// line 297
echo " <a href=";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("news_detail", ["id" => twig_get_attribute($this->env, $this->source, $context["News"], "id", [], "any", false, false, true, 297)]), "html", null, true);
echo " class=\"ec-sliderRole__newsItem\" target=\"_blank\">
<div class=\"ec-sliderRole__newsHeading\">
<div class=\"ec-sliderRole__newsDate\">
";
// line 300
echo twig_escape_filter($this->env, $this->extensions['Eccube\Twig\Extension\IntlExtension']->date_day($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, $context["News"], "publish_date", [], "any", false, false, true, 300), 300, $this->source)), "html", null, true);
echo "
</div>
<div class=\"ec-sliderRole__newsColumn\">
<div class=\"ec-sliderRole__newsTitle\">
";
// line 304
echo twig_escape_filter($this->env, $this->sandbox->ensureToStringAllowed(twig_get_attribute($this->env, $this->source, $context["News"], "title", [], "any", false, false, true, 304), 304, $this->source), "html", null, true);
echo "
</div>
";
// line 313
echo " </div>
</div>
";
// line 322
echo " </a>
";
}
$_parent = $context['_parent'];
unset($context['_seq'], $context['_iterated'], $context['_key'], $context['News'], $context['_parent'], $context['loop']);
$context = array_intersect_key($context, $_parent) + $_parent;
// line 324
echo " </div>
</div>
</div>
";
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
}
public function getTemplateName()
{
return "index.twig";
}
public function isTraitable()
{
return false;
}
public function getDebugInfo()
{
return array ( 439 => 324, 432 => 322, 428 => 313, 423 => 304, 416 => 300, 409 => 297, 405 => 296, 375 => 269, 369 => 266, 363 => 263, 357 => 260, 349 => 254, 339 => 253, 314 => 237, 210 => 135, 200 => 134, 77 => 19, 67 => 18, 56 => 11, 54 => 15, 52 => 13, 39 => 11,);
}
public function getSourceContext()
{
return new Source("{#
This file is part of EC-CUBE
Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
http://www.ec-cube.co.jp/
For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.
#}
{% extends 'default_frame.twig' %}
{% set body_class = 'front_page' %}
{% set NewsList = repository('Eccube\\\\Entity\\\\News').getList() %}
{% block stylesheet %}
<style>
.slick-slider{
height:100%;
width: 100%;
overflow: hidden;
}
.main_visual.slick-slider .slick-list,
.main_visual.slick-slider .slick-track,
.main_visual.slick-slider .slick-slide,
.main_visual.slick-slider .slick-track > .slick-slide > div,
.main_visual.slick-slider .slick-slide img{
height:100%;
}
.main_visual.slick-slider .slick-slide{
overflow:hidden;
}
\t\t\t\t.main_visual.slick-slider .slick-cloned img,
.main_visual.slick-slider .slick-slide img{
opacity:0.8;
\t\t\t\t\tscale: 1.7;
\t\t\t\t\ttranslate: -5% 0;
\t margin-left:auto;
transition: scale 6.5s cubic-bezier(0.1, 1, 0.2, 1) , translate 6.5s;
}
.main_visual.slick-slider:before {
background: rgba(60, 20, 0, .2);
content: '';
display: block;
height: 100%;
left: 0;
opacity: .6;
position: absolute;
top: 0;
width: 100%;
z-index: 10;
}
.main_visual.slick-slider:after {
background: linear-gradient(217deg, rgba(110, 72, 51, .6), rgba(255, 0, 0, 0) 70.71%), linear-gradient(127deg, rgba(241, 234, 230, .6), rgba(0, 255, 0, 0) 70.71%), linear-gradient(336deg, rgba(249, 247, 245, .6), rgba(0, 0, 255, 0) 70.71%);
content: '';
display: block;
height: 100%;
left: 0;
opacity: .6;
position: absolute;
top: 0;
width: 100%;
z-index: 5;
}
.slick-slide{
position:relative;
}
/* ¥Æ¥¥¹¥È¤Î¥Õ¥§©`¥É¥¤¥ó¤È¥¹¥é¥¤¥É¥¤¥ó */
.main {
opacity: 0;
transform: translateX(10vw); /* ÓÒ¤«¤é¥¹¥é¥¤¥É¥¤¥ó */
transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.sub {
opacity: 0;
transform: translateX(10vw); /* ÓÒ¤«¤é¥¹¥é¥¤¥É¥¤¥ó */
transition: opacity 0.5s ease-in-out 0.3s, transform 0.5s ease-in-out 0.2s; /* 0.2ÃëßW¤ì */
}
.fade-in .main {
opacity: 1;
transform: translateX(0); /* Ôª¤ÎλÖäˑø¤ë */
}
.fade-in .sub {
opacity: 1;
transform: translateX(0); /* Ôª¤ÎλÖäˑø¤ë */
}
/* ±³¾°»Ïñ¤ÎÔO¶¨ */
.slick-slide {
overflow:hidden;
}
@-webkit-keyframes fadezoom {
0% {
transform: scale(1);
}
100% {
transform: scale(1.25);
}
}
@keyframes fadezoom {
0% {
transform: scale(1);
}
100% {
transform: scale(1.25);
}
}
.slick-animation {
\t\t\tscale: 1.1 !important;
\t\t\ttranslate: 5% 0 !important;
/* animation: fadezoom 20s linear 0s normal both; */
}
</style>
{% endblock %}
{% block javascript %}
<script>
\t\t\t\$(function() {
\t\t\t\t// ¥á¥¤¥ó¥¹¥é¥¤¥À©`¤Î³õÆÚ»¯•r¤Î¥¤¥Ù¥ó¥È
\t\t\t \$('.main_visual').on('init', function () {
\t\t\t // ×î³õ¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$('.main_visual .slick-slide[data-slick-index=\"0\"] img').addClass('slick-animation');
\t\t\t });
\t\t\t // ¥á¥¤¥ó¥¹¥é¥¤¥À©`¤ÎÔO¶¨
\t\t\t \$('.main_visual').slick({
\t\t\t autoplay: true, // ×Ô„ÓÔÙÉú
\t\t\t infinite: true, // ŸoÏÞ¥ë©`¥×
\t\t\t slidesToShow: 1, // 1¤Ä¤Î¥¹¥é¥¤¥É¤ò±íʾ
\t\t\t slidesToScroll: 1, // ¥¹¥é¥¤¥É¤ò1¤Ä¤º¤Ä¥¹¥¯¥í©`¥ë
\t\t\t arrows: false, // ʸӡ¤ò·Ç±íʾ
\t\t\t speed: 2000, // ¥Õ¥§©`¥É¥¢¥Ë¥á©`¥·¥ç¥ó¤ÎËÙ¶È
\t\t\t autoplaySpeed: 5000, // ¥¹¥é¥¤¥É¤¬ÇФêÌæ¤ï¤ëég¸ô
\t\t\t pauseOnFocus: false, // ¥Õ¥©©`¥«¥¹•r¤Ë¥¹¥é¥¤¥É¤òÒ»•rÍ£Ö¹¤·¤Ê¤¤
\t\t\t pauseOnHover: false, // ¥Û¥Ð©`•r¤Ë¥¹¥é¥¤¥É¤òÒ»•rÍ£Ö¹¤·¤Ê¤¤
\t\t\t asNavFor: '.text_slider' // .text_slider ¤ÈͬÆÚ
\t\t\t })
\t\t\t .on({
\t\t\t beforeChange: function(event, slick, currentSlide, nextSlide) {
\t\t\t // ¤¹¤Ù¤Æ¤Î¥¹¥é¥¤¥É¤Î¥¢¥Ë¥á©`¥·¥ç¥ó¤ò¥ê¥»¥Ã¥È
\t\t\t \$(\".main_visual .slick-slide img\").removeClass(\"slick-animation\");
\t\t\t // ´Î¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$(\".main_visual .slick-slide[data-slick-index='\" + nextSlide + \"'] img\").addClass(\"slick-animation\");
\t\t\t // ´Î¤Î¥¹¥é¥¤¥É¤Ë¥¢¥Ë¥á©`¥·¥ç¥ó¤òßmÓÃ
\t\t\t \$(\".main_visual .slick-cloned img\").addClass(\"slick-animation\");
\t\t\t },
\t\t\t afterChange: function(event, slick, currentSlide) {
\t\t\t // Ç°¤Î¥¹¥é¥¤¥É¤Î¥¤¥ó¥Ç¥Ã¥¯¥¹¤òÓ‹Ëã
\t\t\t var prevSlide = (currentSlide === 0) ? slick.slideCount - 1 : currentSlide - 1;
\t\t\t // Ç°¤Î¥¹¥é¥¤¥É¤Î¥¢¥Ë¥á©`¥·¥ç¥ó¤ò¥ê¥»¥Ã¥È
\t\t\t \$(\".main_visual .slick-slide[data-slick-index='\" + prevSlide + \"'] img\").removeClass(\"slick-animation\");
\t\t\t \$(\".main_visual .slick-cloned img\").removeClass(\"slick-animation\");
\t\t\t }
\t\t\t });
// ¥Æ¥¥¹¥È¥¹¥é¥¤¥À©`¤Î³õÆÚ»¯•r¤Î¥¤¥Ù¥ó¥È
\$('.text_slider').on('init', function () {
// ×î³õ¤Î¥¹¥é¥¤¥É¤Ë 'fade-in' ¥¯¥é¥¹¤òßmÓÃ
\$('.slick-slide[data-slick-index=\"0\"]').addClass('fade-in');
});
// ¥Æ¥¥¹¥È¥¹¥é¥¤¥À©`¤ÎÔO¶¨£¨¥á¥¤¥ó¥¹¥é¥¤¥À©`¤ÈͬÆÚ£©
\$('.text_slider').slick({
autoplay: true, // ×Ô„ÓÔÙÉú
infinite: true, // ŸoÏÞ¥ë©`¥×
slidesToShow: 1, // 1¤Ä¤Î¥¹¥é¥¤¥É¤ò±íʾ
slidesToScroll: 1, // ¥¹¥é¥¤¥É¤ò1¤Ä¤º¤Ä¥¹¥¯¥í©`¥ë
fade: true,
speed: 1000,
autoplaySpeed: 5000,
arrows: false,
pauseOnFocus: false,
pauseOnHover: false,
pauseOnDotsHover: false,
asNavFor: '.main_visual' // .main_visual ¤ÈͬÆÚ
})
.on({
beforeChange: function(event, slick, currentSlide, nextSlide) {
// ´Î¤Î¥¹¥é¥¤¥É¤Ë 'fade-in' ¥¯¥é¥¹¤ò×·¼Ó
\$(\".text_slider .slick-slide[data-slick-index='\" + nextSlide + \"']\").addClass(\"fade-in\");
},
afterChange: function(event, slick, currentSlide) {
// ¬FÔڤΥ¹¥é¥¤¥ÉÒÔÍâ¤Î¤¹¤Ù¤Æ¤Î¥¹¥é¥¤¥É¤«¤é 'fade-in' ¥¯¥é¥¹¤òÏ÷³ý
\$(\".text_slider .slick-slide\").not(\"[data-slick-index='\" + currentSlide + \"']\").not(\".slick-cloned\").removeClass(\"fade-in\");
// ¬FÔڤΥ¹¥é¥¤¥É¤Ë¥¯¥é¥¹¤ò´_Œg¤Ë×·¼Ó
\$(\".text_slider .slick-slide[data-slick-index='\" + currentSlide + \"']\").addClass(\"fade-in\");
}
});
});
\$(function() {
\$('.topic_slider').slick({
vertical: true,
autoplay: true,
autoplaySpeed: 3800,
speed: 800,
arrows: true,
pauseOnFocus: false,
pauseOnHover: false,
pauseOnDotsHover: false
});
\$('.ec-sliderRole__news').each(function() {
var listLength = \$(this).find('.ec-sliderRole__newsItem').length;
if (listLength > 5) {
\$(this).find('.ec-sliderRole__newsItem:gt(4)').each(function() {
\$(this).hide();
});
\$(this).append('<a id=\"news_readmore\" class=\"ec-inlineBtn--top\">{{ 'more'|trans }}</a>');
var dispNum = 5;
\$(this).find('#news_readmore').click(function() {
dispNum += 5;
\$(this).parent().find('.ec-sliderRole__newsItem:lt(' + dispNum + ')').show();
if (dispNum >= listLength) {
\$(this).hide();
}
})
}
});
});
</script>
{% endblock javascript %}
{% block main %}
<div class=\"ec-sliderRole\">
<div class=\"ec-sliderRole__wrap\">
<div class=\"mv__wrap\">
<div class=\"main_visual\">
<div class=\"item slick-slide\">
<img src=\"{{ asset('assets/img/top/01.jpg') }}\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"{{ asset('assets/img/top/02.jpg') }}\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"{{ asset('assets/img/top/03.jpg') }}\" class=\"outset\">
</div>
<div class=\"item slick-slide\">
<img src=\"{{ asset('assets/img/top/04.jpg') }}\" class=\"outset\">
</div>
</div>
<div class=\"text_slider\">
<div class=\"ec-sliderRole__title\">
<div class=\"main\">Lillie and</div>
<div class=\"sub\">Garcello</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">ORIGINAL</div>
<div class=\"sub\">GOODS</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">SELECT</div>
<div class=\"sub\">SHOP</div>
</div>
<div class=\"ec-sliderRole__title\">
<div class=\"main\">RECOMMENDED</div>
<div class=\"sub\">ITEM</div>
</div>
</div>
</div>
<div class=\"ec-sliderRole__news topic_slider\">
{% for News in NewsList %}
<a href={{ url('news_detail', {'id': News.id}) }} class=\"ec-sliderRole__newsItem\" target=\"_blank\">
<div class=\"ec-sliderRole__newsHeading\">
<div class=\"ec-sliderRole__newsDate\">
{{ News.publish_date|date_day }}
</div>
<div class=\"ec-sliderRole__newsColumn\">
<div class=\"ec-sliderRole__newsTitle\">
{{ News.title }}
</div>
{# {% if News.description or News.url %}
<div class=\"ec-sliderRole__newsClose\">
<a class=\"ec-sliderRole__newsCloseBtn\">
<i class=\"fas fa-angle-down\"></i>
</a>
</div>
{% endif %} #}
</div>
</div>
{# <div class=\"ec-sliderRole__newsDescription\">
{{ News.description|raw|nl2br }}
{% if News.url %}
<br>
<a href=\"{{ News.url }}\" {% if News.link_method == '1' %}target=\"_blank\"{% endif %}>{{ 'Ô”¤·¤¯¤Ï¤³¤Á¤é'|trans }}</a>
{% endif %}
</div> #}
</a>
{% endfor %}
</div>
</div>
</div>
{% endblock %}
", "index.twig", "/home/egonet/c-bcl.com/public_html/shop/app/template/lag/index.twig");
}
public function checkSecurity()
{
static $tags = array("set" => 13, "for" => 296);
static $filters = array("escape" => 237, "trans" => 237, "date_day" => 300);
static $functions = array("repository" => 15, "asset" => 260, "url" => 297);
try {
$this->sandbox->checkSecurity(
['set', 'for'],
['escape', 'trans', 'date_day'],
['repository', 'asset', 'url']
);
} catch (SecurityError $e) {
$e->setSourceContext($this->source);
if ($e instanceof SecurityNotAllowedTagError && isset($tags[$e->getTagName()])) {
$e->setTemplateLine($tags[$e->getTagName()]);
} elseif ($e instanceof SecurityNotAllowedFilterError && isset($filters[$e->getFilterName()])) {
$e->setTemplateLine($filters[$e->getFilterName()]);
} elseif ($e instanceof SecurityNotAllowedFunctionError && isset($functions[$e->getFunctionName()])) {
$e->setTemplateLine($functions[$e->getFunctionName()]);
}
throw $e;
}
}
}