www.lightcourse.com/app/home/view/default/mall/index/index.html

269 lines
13 KiB
HTML
Raw Normal View History

2022-10-24 02:38:36 +00:00
{include file='default/base/mall_top'/}
{block name="mall_main"}
<link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/new/css/index.css">
<style>
2022-10-25 09:24:47 +00:00
.main-other-qa {
display: none;
}
@media screen and (max-width: 1024px) {
main .main-1 .container .item:nth-of-type(n+10) {
display: none;
}
}
2022-10-24 02:38:36 +00:00
</style>
<script>
2022-10-25 09:24:47 +00:00
$(document).ready(function() {
$.each($("main .main-4 .container .item .t div span"), function() {
$(this).text($(this).text().slice(0, 10))
})
})
2022-10-24 02:38:36 +00:00
</script>
<div class="index-banner">
2022-10-25 09:24:47 +00:00
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="imgg"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-01.jpg" alt="See how LightCourse works"></div>
<div class="index-banner-txt ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.2s">
2022-10-25 09:24:47 +00:00
<ins>7000+</ins>
<em> College Courses</em>
<span>Earn Credits in<br />a More Flexible Way</span>
</div>
<a class="index-banner-btn ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="1s" swiper-animate-delay="0.2s" href="/document" target="_blank"><span>See how LightCourse works<em>></em></span></a>
<div class="index-banner-float ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.2s"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-float.png" alt="图案"></div>
2022-10-25 09:24:47 +00:00
</div>
<div class="swiper-slide">
<div class="imgg"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-02.jpg" alt="See how LightCourse works"></div>
<div class="index-banner-txt ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.2s">
2022-10-25 09:24:47 +00:00
<ins>7000+</ins>
<em> College Courses</em>
<span>Earn Credits in<br />a More Flexible Way</span>
</div>
<a class="index-banner-btn ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="1s" swiper-animate-delay="0.2s" href="/document" target="_blank"><span>See how LightCourse works<em>></em></span></a>
<div class="index-banner-float ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.2s"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-float.png" alt="图案"></div>
2022-10-25 09:24:47 +00:00
</div>
<div class="swiper-slide">
<div class="imgg"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-03.jpg" alt="See how LightCourse works"></div>
<div class="index-banner-txt ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.2s">
2022-10-25 09:24:47 +00:00
<ins>7000+</ins>
<em> College Courses</em>
<span>Earn Credits in<br />a More Flexible Way</span>
</div>
<a class="index-banner-btn ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="1s" swiper-animate-delay="0.2s" href="/document" target="_blank"><span>See how LightCourse works<em>></em></span></a>
<div class="index-banner-float ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.2s"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-float.png" alt="图案"></div>
2022-10-25 09:24:47 +00:00
</div>
<div class="swiper-slide">
<div class="imgg"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-04.jpg" alt="See how LightCourse works"></div>
<div class="index-banner-txt ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="0.2s">
2022-10-25 09:24:47 +00:00
<ins>7000+</ins>
<em> College Courses</em>
<span>Earn Credits in<br />a More Flexible Way</span>
</div>
<a class="index-banner-btn ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="1s" swiper-animate-delay="0.2s" href="/document" target="_blank"><span>See how LightCourse works<em>></em></span></a>
<div class="index-banner-float ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.2s"><img src="{$Think.HOME_SITE_ROOT}/new/images/banner-float.png" alt="图案"></div>
2022-10-25 09:24:47 +00:00
</div>
</div>
</div>
<div class="index-banner-info wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-25 09:24:47 +00:00
<div class="left">
2022-10-27 13:44:51 +00:00
<h2 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">The Services<br />We Provide</h2>
<span class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">7000+ College Courses</span>
2022-10-25 09:24:47 +00:00
</div>
<div class="right">
<div class="item">
2022-10-27 13:44:51 +00:00
<span class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">Featured For-Credit Courses</span>
<em class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">In collaboration with our global partner institutions, LightCourse offers 7000+ accredited college courses encompassing 300+ majors and disciplines. Join us today to earn college credits in a flexible and saving way.</em>
2022-10-25 09:24:47 +00:00
</div>
<div class="item">
2022-10-27 13:44:51 +00:00
<span class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">Study Abroad Programs</span>
<em class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">In collaboration with our global partner institutions, LightCourse offers 7000+ accredited college courses encompassing 300+ majors and disciplines. Join us today to earn college credits in a flexible and saving way.</em>
2022-10-25 09:24:47 +00:00
</div>
</div>
</div>
2022-10-24 02:38:36 +00:00
</div>
<main>
2022-10-25 09:24:47 +00:00
<section class="main-1">
<div class="main-title wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-27 13:44:51 +00:00
<h2 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">Featured For-Credit Courses</h2>
<p class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
In collaboration with our global partner institutions, <br />
LightCourse offers 7000+ accredited college courses encompassing 300+ majors and disciplines. <br />
Join us today to earn college credits in a flexible and saving way.
</p>
</div>
<div class="main-center container wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-25 09:24:47 +00:00
{notempty name="recommend"}
{foreach name="recommend" key="goods_key" item="goods"}
2022-10-27 13:44:51 +00:00
<a href="{:url('/Goods/index',['goods_id'=>$goods.goods_id])}" target="_blank" class="item wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
<div class="img imgggg"><img src="{:goods_cthumb($goods.goods_image)}" alt="{$goods.goods_name}"></div>
<ins class="pull-bg"></ins>
<div class="icon-more"><img src="{$Think.HOME_SITE_ROOT}/new/images/icon-more.png" alt="查看详情"></div>
<div class="text" num="1">
2022-10-27 13:44:51 +00:00
<h3 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">{$goods.goods_name}</h3>
<div class="par-con wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
<div class="par w100">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xianshangliuliang"></use>
</svg>Institution: &nbsp;<span>{$goods.ke_simple_college}</span>
</div>
<div class="par w100">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shijian"></use>
</svg>Credit(s): &nbsp;<span>{$goods.ke_credit}</span>
</div>
<div class="par w100">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-rili"></use>
</svg>Start Date: &nbsp;<span>{$goods.ke_start_time}</span>
</div>
</div>
</div>
</a>
{/foreach}
{/notempty}
</div>
<div class="more-btn1">
<a href="/brand">View All Courses</a>
</div>
</section>
<section class="main-2 wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-25 09:24:47 +00:00
<div class="main-title">
2022-10-27 13:44:51 +00:00
<h2 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">Study Abroad Programs</h2>
<p class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
Credit-bearing LightCourse study abroad programs are hosted by prestigious institutions in several
global cities. <br>
Students can gain unique cultural experiences studying abroad throughout the summer in cities like San
Francisco (USA), <br>
Florence (Italy), Seoul (South Korea), Tokyo (Japan), Shanghai (China), and Beijing (China).
</p>
</div>
2022-10-27 13:44:51 +00:00
<div class="main-center container wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
<div class="swiper-container">
<div class="swiper-wrapper">
{notempty name="program"}
{foreach name="program" item="val" key="key" }
<!-- <a href="/home/search?cate_id={$val.gc_id}" class="swiper-slide item">-->
<a href="/program" class="swiper-slide item">
<div class="img"><img src="/uploads/home/common/{$val.gc_image}" alt=""></div>
<!-- <div class="logo"><img src="/uploads/home/common/{$val.pro_logo}" alt=""></div> -->
<div class="text">
<p class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0.5s" swiper-animate-delay="0">
<em>Partner Institution</em>
<span>{$val['class3'][0]['gc_name']}</span>
</p>
<p class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s">
<em>Program Name</em>
<span>{$val.gc_name}</span>
</p>
</div>
</a>
{/foreach}
{/notempty}
</div>
<div class="more-btn1">
<a href="/program">View All Programs<em>></em></a>
</div>
<div class="swiper-button swiper-button-prev"></div>
<div class="swiper-button swiper-button-next"></div>
</div>
</div>
</section>
<section class="main-3 wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-25 09:24:47 +00:00
<div class="main-title">
2022-10-27 13:44:51 +00:00
<h2 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">Our Vision</h2>
<p class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">{$wish_en}</p>
2022-10-25 09:24:47 +00:00
</div>
<div class="more-btn1">
<a href="/promotion">Learn More</a>
</div>
</section>
<section class="main-4 wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0">
2022-10-25 09:24:47 +00:00
<div class="main-title">
2022-10-27 13:44:51 +00:00
<h2 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">LightCourse Blog</h2>
<p class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">News and live information about light course.</p>
2022-10-25 09:24:47 +00:00
</div>
<div class="main-center container">
{notempty name="article"}
{foreach name="article" item="val" key="key" }
2022-10-27 13:44:51 +00:00
<a href="/article/show?article_id={$val.article_id}" class="item wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
<div class="img">
<img src="{:ds_get_pic(ATTACH_ARTICLE,$val.article_pic)}" alt="{$val['article_title']}">
<ins class="pull-bg"></ins>
2022-10-27 13:44:51 +00:00
<h3 class="wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">{$val['article_title']}</h3>
2022-10-25 09:24:47 +00:00
<!-- <em>NEWS</em>
<span>{$val['article_date']}</span> -->
</div>
2022-10-27 13:44:51 +00:00
<div class="txt wow fadeInUp" data-wow-duration="0.8s" data-wow-delay="0.2s">
2022-10-25 09:24:47 +00:00
{$val['article_desc']}
</div>
</a>
{/foreach}
{/notempty}
</div>
<div class="more-btn">
<a href="/Article?ac_id=8" target="_blank">Learn More<em>></em></a>
</div>
</section>
2022-10-24 02:38:36 +00:00
</main>
{/block}
{include file='default/base/mall_footer'/}
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-EX6H2927S7"></script>
<script>
2022-10-25 09:24:47 +00:00
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-EX6H2927S7');
2022-10-24 02:38:36 +00:00
</script>
<script>
2022-10-25 09:24:47 +00:00
var main1 = new Swiper('.index-banner .swiper-container',{
loop:true,//开启循环播放
autoplay: true, //自动播放
effect : 'fade',//轮播的动效 默认为"slide"(普通位移切换),还可设置为"fade"(淡入)、"cube"(方块)、"coverflow"3d流、"flip"3d翻转、"cards"(卡片式)、"creative"(创意性)。
fadeEffect: {
crossFade: true,
},
on:{
init: function(){
swiperAnimateCache(this); // 隐藏动画元素
swiperAnimate(this); // 初始化完成开始动画
},
slideChangeTransitionEnd: function(){
swiperAnimate(this); // 每个slide切换结束时也运行当前slide动画
// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次去除ani类名
},
}
});
var main2 = new Swiper(".main-2 .swiper-container", {
loop:false,//开启循环播放
autoplay: true, //自动播放
effect : 'fade',//轮播的动效 默认为"slide"(普通位移切换),还可设置为"fade"(淡入)、"cube"(方块)、"coverflow"3d流、"flip"3d翻转、"cards"(卡片式)、"creative"(创意性)。
fadeEffect: {
crossFade: true,
},
navigation: {
prevEl: ".main-2 .swiper-button-prev",
nextEl: ".main-2 .swiper-button-next",
},
on:{
init: function(){
swiperAnimateCache(this); // 隐藏动画元素
swiperAnimate(this); // 初始化完成开始动画
},
slideChangeTransitionEnd: function(){
swiperAnimate(this); // 每个slide切换结束时也运行当前slide动画
// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次去除ani类名
},
}
})
</script>