Commit 020c272b by Pham Huy

update animate homepage

parent 1e8b22a7
......@@ -47,9 +47,9 @@ h2{
padding-right: 15px;
}
ul#menu-main-menu{
-moz-box-shadow: 0px 1px 4px #00000070;
-webkit-box-shadow: 0px 1px 4px #00000070;
box-shadow: 0px 1px 4px #00000070;
-moz-box-shadow: 0px 1px 8px #00000052;
-webkit-box-shadow: 0px 1px 8px #00000052;
box-shadow: 0px 1px 8px #00000052;
border-radius: 4px;
}
......
......@@ -23,8 +23,8 @@ $img_homepage = wp_get_attachment_image_src(70, '59x59');
<img src="<?php echo $logo_footer[0] ?>" class="img-fluid footer-logo">
<p class="footer-desc">TRUNG TÂM HỖ TRỢ A HÓA ĐƠN</p>
<div id="lienket">
<div class="btn btn-1"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2"><a href="#">Đăng ký đại lý</a></div>
<div class="btn btn-1 wow zoomIn"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2 wow zoomIn"><a href="#">Đăng ký đại lý</a></div>
</div>
</div>
......
......@@ -597,14 +597,15 @@ function hdv_style() {
wp_register_style('slicknav', get_template_directory_uri() . '/css/slicknav.css', 'all');
wp_register_style('slickcss', get_template_directory_uri() . '/css/slick.css', 'all');
wp_register_style('slick-themecss', get_template_directory_uri() . '/css/slick-theme.css', 'all');
wp_register_style('fontawesome', get_template_directory_uri() . '/css/all.css', 'all');
wp_register_style('responsesive', get_template_directory_uri() . '/css/responsive.css', 'all');
wp_register_style('animatecss', get_template_directory_uri() . '/css/animate.css','','3.7.2', 'all');
wp_register_style('main-style', get_template_directory_uri() . '/css/hdv.css', 'all');
wp_register_script('main-jquery', get_template_directory_uri() . '/js/jquery-3.3.1.min.js', array('jquery'),'3.3', true);
wp_register_script('main-style', get_template_directory_uri() . '/js/bootstrap.js', array('jquery'),'4.3.1', true);
wp_register_script('slicknav-js', get_template_directory_uri() . '/js/jquery.slicknav.min.js', array('jquery'),'1.0.10', true);
wp_register_script('slick-carousel', get_template_directory_uri() . '/js/slick.min.js', array('jquery'),'1.8.1', true);
wp_register_script('wow-js', get_template_directory_uri() . '/js/wow.min.js', array('jquery'),'1.3.0', true);
wp_register_script('hdv-js', get_template_directory_uri() . '/js/hdv.js', array('jquery'),'1.0', true);
wp_enqueue_style('main-bootstrap');
......@@ -612,11 +613,13 @@ function hdv_style() {
wp_enqueue_style('slickcss');
wp_enqueue_style('slick-themecss');
wp_enqueue_style('fontawesome');
wp_enqueue_style('animatecss');
wp_enqueue_style('main-style');
wp_enqueue_script('main-jquery');
wp_enqueue_script('main-style');
wp_enqueue_script('slicknav-js');
wp_enqueue_script('wow-js');
wp_enqueue_script('slick-carousel');
wp_enqueue_script('hdv-js');
}
......
......@@ -29,6 +29,7 @@ if ($('.img-homepage').length) {
}
$(document).ready(function(){
$('.category_usage h5').on('click', function(){
if($(this).attr('aria-expanded') == 'true'){
$(this).find('.fa-angle-up').css('display','none');
......@@ -37,7 +38,7 @@ $(document).ready(function(){
$(this).find('.fa-angle-up').css('display','block');
$(this).find('.fa-angle-down').css('display','none');
}
});
});
$('#price_slider').slick({
dots: true,
......@@ -74,4 +75,6 @@ $(document).ready(function(){
// instead of a settings object
]
});
// wow js
new WOW().init();
})
\ No newline at end of file
/*! WOW wow.js - v1.3.0 - 2016-10-04
* https://wowjs.uk
* Copyright (c) 2016 Thomas Grainger; Licensed MIT */!function(a,b){if("function"==typeof define&&define.amd)define(["module","exports"],b);else if("undefined"!=typeof exports)b(module,exports);else{var c={exports:{}};b(c,c.exports),a.WOW=c.exports}}(this,function(a,b){"use strict";function c(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function d(a,b){return b.indexOf(a)>=0}function e(a,b){for(var c in b)if(null==a[c]){var d=b[c];a[c]=d}return a}function f(a){return/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(a)}function g(a){var b=arguments.length<=1||void 0===arguments[1]?!1:arguments[1],c=arguments.length<=2||void 0===arguments[2]?!1:arguments[2],d=arguments.length<=3||void 0===arguments[3]?null:arguments[3],e=void 0;return null!=document.createEvent?(e=document.createEvent("CustomEvent"),e.initCustomEvent(a,b,c,d)):null!=document.createEventObject?(e=document.createEventObject(),e.eventType=a):e.eventName=a,e}function h(a,b){null!=a.dispatchEvent?a.dispatchEvent(b):b in(null!=a)?a[b]():"on"+b in(null!=a)&&a["on"+b]()}function i(a,b,c){null!=a.addEventListener?a.addEventListener(b,c,!1):null!=a.attachEvent?a.attachEvent("on"+b,c):a[b]=c}function j(a,b,c){null!=a.removeEventListener?a.removeEventListener(b,c,!1):null!=a.detachEvent?a.detachEvent("on"+b,c):delete a[b]}function k(){return"innerHeight"in window?window.innerHeight:document.documentElement.clientHeight}Object.defineProperty(b,"__esModule",{value:!0});var l,m,n=function(){function a(a,b){for(var c=0;c<b.length;c++){var d=b[c];d.enumerable=d.enumerable||!1,d.configurable=!0,"value"in d&&(d.writable=!0),Object.defineProperty(a,d.key,d)}}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),o=window.WeakMap||window.MozWeakMap||function(){function a(){c(this,a),this.keys=[],this.values=[]}return n(a,[{key:"get",value:function(a){for(var b=0;b<this.keys.length;b++){var c=this.keys[b];if(c===a)return this.values[b]}}},{key:"set",value:function(a,b){for(var c=0;c<this.keys.length;c++){var d=this.keys[c];if(d===a)return this.values[c]=b,this}return this.keys.push(a),this.values.push(b),this}}]),a}(),p=window.MutationObserver||window.WebkitMutationObserver||window.MozMutationObserver||(m=l=function(){function a(){c(this,a),"undefined"!=typeof console&&null!==console&&(console.warn("MutationObserver is not supported by your browser."),console.warn("WOW.js cannot detect dom mutations, please call .sync() after loading new content."))}return n(a,[{key:"observe",value:function(){}}]),a}(),l.notSupported=!0,m),q=window.getComputedStyle||function(a){var b=/(\-([a-z]){1})/g;return{getPropertyValue:function(c){"float"===c&&(c="styleFloat"),b.test(c)&&c.replace(b,function(a,b){return b.toUpperCase()});var d=a.currentStyle;return(null!=d?d[c]:void 0)||null}}},r=function(){function a(){var b=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];c(this,a),this.defaults={boxClass:"wow",animateClass:"animated",offset:0,mobile:!0,live:!0,callback:null,scrollContainer:null,resetAnimation:!0},this.animate=function(){return"requestAnimationFrame"in window?function(a){return window.requestAnimationFrame(a)}:function(a){return a()}}(),this.vendors=["moz","webkit"],this.start=this.start.bind(this),this.resetAnimation=this.resetAnimation.bind(this),this.scrollHandler=this.scrollHandler.bind(this),this.scrollCallback=this.scrollCallback.bind(this),this.scrolled=!0,this.config=e(b,this.defaults),null!=b.scrollContainer&&(this.config.scrollContainer=document.querySelector(b.scrollContainer)),this.animationNameCache=new o,this.wowEvent=g(this.config.boxClass)}return n(a,[{key:"init",value:function(){this.element=window.document.documentElement,d(document.readyState,["interactive","complete"])?this.start():i(document,"DOMContentLoaded",this.start),this.finished=[]}},{key:"start",value:function(){var a=this;if(this.stopped=!1,this.boxes=[].slice.call(this.element.querySelectorAll("."+this.config.boxClass)),this.all=this.boxes.slice(0),this.boxes.length)if(this.disabled())this.resetStyle();else for(var b=0;b<this.boxes.length;b++){var c=this.boxes[b];this.applyStyle(c,!0)}if(this.disabled()||(i(this.config.scrollContainer||window,"scroll",this.scrollHandler),i(window,"resize",this.scrollHandler),this.interval=setInterval(this.scrollCallback,50)),this.config.live){var d=new p(function(b){for(var c=0;c<b.length;c++)for(var d=b[c],e=0;e<d.addedNodes.length;e++){var f=d.addedNodes[e];a.doSync(f)}});d.observe(document.body,{childList:!0,subtree:!0})}}},{key:"stop",value:function(){this.stopped=!0,j(this.config.scrollContainer||window,"scroll",this.scrollHandler),j(window,"resize",this.scrollHandler),null!=this.interval&&clearInterval(this.interval)}},{key:"sync",value:function(){p.notSupported&&this.doSync(this.element)}},{key:"doSync",value:function(a){if("undefined"!=typeof a&&null!==a||(a=this.element),1===a.nodeType){a=a.parentNode||a;for(var b=a.querySelectorAll("."+this.config.boxClass),c=0;c<b.length;c++){var e=b[c];d(e,this.all)||(this.boxes.push(e),this.all.push(e),this.stopped||this.disabled()?this.resetStyle():this.applyStyle(e,!0),this.scrolled=!0)}}}},{key:"show",value:function(a){return this.applyStyle(a),a.className=a.className+" "+this.config.animateClass,null!=this.config.callback&&this.config.callback(a),h(a,this.wowEvent),this.config.resetAnimation&&(i(a,"animationend",this.resetAnimation),i(a,"oanimationend",this.resetAnimation),i(a,"webkitAnimationEnd",this.resetAnimation),i(a,"MSAnimationEnd",this.resetAnimation)),a}},{key:"applyStyle",value:function(a,b){var c=this,d=a.getAttribute("data-wow-duration"),e=a.getAttribute("data-wow-delay"),f=a.getAttribute("data-wow-iteration");return this.animate(function(){return c.customStyle(a,b,d,e,f)})}},{key:"resetStyle",value:function(){for(var a=0;a<this.boxes.length;a++){var b=this.boxes[a];b.style.visibility="visible"}}},{key:"resetAnimation",value:function(a){if(a.type.toLowerCase().indexOf("animationend")>=0){var b=a.target||a.srcElement;b.className=b.className.replace(this.config.animateClass,"").trim()}}},{key:"customStyle",value:function(a,b,c,d,e){return b&&this.cacheAnimationName(a),a.style.visibility=b?"hidden":"visible",c&&this.vendorSet(a.style,{animationDuration:c}),d&&this.vendorSet(a.style,{animationDelay:d}),e&&this.vendorSet(a.style,{animationIterationCount:e}),this.vendorSet(a.style,{animationName:b?"none":this.cachedAnimationName(a)}),a}},{key:"vendorSet",value:function(a,b){for(var c in b)if(b.hasOwnProperty(c)){var d=b[c];a[""+c]=d;for(var e=0;e<this.vendors.length;e++){var f=this.vendors[e];a[""+f+c.charAt(0).toUpperCase()+c.substr(1)]=d}}}},{key:"vendorCSS",value:function(a,b){for(var c=q(a),d=c.getPropertyCSSValue(b),e=0;e<this.vendors.length;e++){var f=this.vendors[e];d=d||c.getPropertyCSSValue("-"+f+"-"+b)}return d}},{key:"animationName",value:function(a){var b=void 0;try{b=this.vendorCSS(a,"animation-name").cssText}catch(c){b=q(a).getPropertyValue("animation-name")}return"none"===b?"":b}},{key:"cacheAnimationName",value:function(a){return this.animationNameCache.set(a,this.animationName(a))}},{key:"cachedAnimationName",value:function(a){return this.animationNameCache.get(a)}},{key:"scrollHandler",value:function(){this.scrolled=!0}},{key:"scrollCallback",value:function(){if(this.scrolled){this.scrolled=!1;for(var a=[],b=0;b<this.boxes.length;b++){var c=this.boxes[b];if(c){if(this.isVisible(c)){this.show(c);continue}a.push(c)}}this.boxes=a,this.boxes.length||this.config.live||this.stop()}}},{key:"offsetTop",value:function(a){for(;void 0===a.offsetTop;)a=a.parentNode;for(var b=a.offsetTop;a.offsetParent;)a=a.offsetParent,b+=a.offsetTop;return b}},{key:"isVisible",value:function(a){var b=a.getAttribute("data-wow-offset")||this.config.offset,c=this.config.scrollContainer&&this.config.scrollContainer.scrollTop||window.pageYOffset,d=c+Math.min(this.element.clientHeight,k())-b,e=this.offsetTop(a),f=e+a.clientHeight;return d>=e&&f>=c}},{key:"disabled",value:function(){return!this.config.mobile&&f(navigator.userAgent)}}]),a}();b["default"]=r,a.exports=b["default"]});
\ No newline at end of file
......@@ -3,10 +3,10 @@
<div class="container">
<div class="row">
<div class="col-xs-12 col-md-12">
<div class="title-feature">
<div class="title-feature wow slideInLeft">
<h4>Tính năng nổi bật của "A HÓA ĐƠN"</h4>
</div>
<div class="feature-1">
<div class="feature-1 wow slideInRight">
<h4>HỆ THỐNG NỀN TẢNG</h4>
<ul>
<li>Hệ thống phần mềm hoạt động online trên internet, sử dụng phiên bản website tiện lợi, thân thiện cho người dùng.</li>
......@@ -16,7 +16,7 @@
<li>Hệ thống sử dụng tường lửa, hệ thống cân bằng tải, backup dữ liệu thường xuyền, đảm bảo tuyệt đối dữ liệu khách hàng.</li>
</ul>
</div>
<div class="feature-2">
<div class="feature-2 wow slideInRight">
<h4>TIỆN ÍCH KHÁC BIỆT</h4>
<ul>
<li>Hệ thống hỗ trợ cơ sở dữ liệu phân tán hoặc tập trung, có thể đặt ở nhiều nơi, đảm bảo dữ liệu của khác hàng được lưu riêng biệt, bảo mật.</li>
......@@ -26,7 +26,7 @@
<li>Đội ngũ nhân viên hỗ trợ nhiệt tình 24/24 trong quá trình khách hàng sử dụng dịch vụ.</li>
</ul>
</div>
<div class="feature-3">
<div class="feature-3 wow slideInRight">
<h4>KHẢ NĂNG MỞ RỘNG - KẾT NỐI</h4>
<ul>
<li>Hệ thống được thiết lập sẵn sàng cắm thêm nhiều server đáp ứng nhu cầu dữ liệu của khách hàng.</li>
......
......@@ -12,13 +12,13 @@ get_header();
<section id="intro-hd">
<div class="container container-fluid">
<article class="row introduce">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
<h2>A HÓA ĐƠN</h2>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 ">
<h2 class="">A HÓA ĐƠN</h2>
<p class="sub-tit">Giải pháp hóa đơn điện tử chuyên nghiệp</p>
<p><span class="txt-red">A hóa đơn</span> giúp dễ dàng tạo lập, phát hành, quản lý hóa đơn với nhiều tính năng cao cấp, phù hợp đa dạng loại hình, quy mô doanh nghiệp</p>
<div id="lienket">
<div class="btn btn-1"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2"><a href="#">Đăng ký đại lý</a></div>
<div class="btn btn-1 wow zoomIn"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2 wow zoomIn"><a href="#">Đăng ký đại lý</a></div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
......@@ -31,9 +31,9 @@ get_header();
<section id="show-hd">
<div class="container container-fluid">
<article class="row showhome">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 "><div class="img-showhome"></div></div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 wow jackInTheBox"><div class="img-showhome"></div></div>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
<div class="content-showhome">
<div class="content-showhome wow flipInX">
<h3>HÓA ĐƠN ĐIỆN TỬ LÀ GÌ?</h3>
<p>Hóa đơn điện tử là tập hợp các thông điệp dữ liệu điện tử về bán hàng hoá, cung ứng dịch vụ, được khởi tạo, lập, gửi, nhận, lưu trữ và quản lý bằng phương tiện điện tử. </p>
<p>Hóa đơn điện tử phải đáp ứng các nội dung quy định tại Điều 6 Thông tư 32 này.</p>
......@@ -56,36 +56,36 @@ get_header();
<p class="mf-title-sub">Lợi ích của hóa đơn điện tử đối với doanh nghiệp:</p>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-1">
<div class="content-ft-1 wow rotateInUpLeft">
<h3>AN TOÀN</h3>
<p>Không xảy ra cháy, hỏng, mất hóa đơn. Tăng độ tin cậy cho hóa đơn của doanh nghiệp</p>
<div class="icon-ft-1"></div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-2">
<div class="content-ft-2 wow rotateInUpRight">
<h3>NHANH CHÓNG</h3>
<p>Người mua tức thời nhận được hóa đơn, rút ngắn thời gian thu nợ</p>
<div class="icon-ft-2"></div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-3">
<div class="content-ft-3 wow rotateInUpLeft" >
<h3>TIẾT KIỆM</h3>
<p>Tiết kiệm 90% chi phí in ấn, vận chuyển, lưu trữ và bảo quản hóa đơn</p>
<div class="icon-ft-3"></div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="content-ft-4">
<div class="content-ft-4 wow rotateInUpRight" >
<h3>BẢO VỆ MÔI TRƯỜNG</h3>
<p>Giảm bớt việc sử dụng giấy, góp phần bảo vệ môi trường</p>
<div class="icon-ft-4"></div>
</div>
</div>
<div id="lienket">
<div class="btn btn-1"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2"><a href="#">Đăng ký đại lý</a></div>
<div class="btn btn-1 wow zoomIn"><a href="#">Đăng ký sử dụng</a></div>
<div class="btn btn-2 wow zoomIn"><a href="#">Đăng ký đại lý</a></div>
</div>
</div>
</div>
......@@ -96,7 +96,7 @@ get_header();
<h2 class="prices-title">BẢNG GIÁ PHẦN MỀM "A HÓA ĐƠN"</h2>
<div id="price_slider" class="row">
<div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price">
<div class="card text-center box-price wow slideInUp">
<h2 class="card-header"> HD1 3000 </h2>
<article class="card-body">
<p class="card-text">Số hóa đơn</p>
......@@ -108,7 +108,7 @@ get_header();
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price">
<div class="card text-center box-price wow slideInUp">
<h2 class="card-header"> HD1 3000 </h2>
<article class="card-body">
<p class="card-text">Số hóa đơn</p>
......@@ -120,7 +120,7 @@ get_header();
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price">
<div class="card text-center box-price wow slideInUp">
<h2 class="card-header"> HD1 3000 </h2>
<article class="card-body">
<p class="card-text">Số hóa đơn</p>
......@@ -132,7 +132,7 @@ get_header();
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-4">
<div class="card text-center box-price">
<div class="card text-center box-price wow slideInUp">
<h2 class="card-header"> HD1 3000 </h2>
<article class="card-body">
<p class="card-text">Số hóa đơn</p>
......@@ -145,9 +145,9 @@ get_header();
</div>
</div>
<div class="row text-center price_fee">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<p class="txt-red"> PHÍ KHỞI TẠO: 800.000 VNĐ </p>
<p>Phí chưa bao gồm VAT 10%</p>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 wow zoomIn">
<p class="txt-red"> PHÍ KHỞI TẠO: 800.000 VNĐ </p>
<p>Phí chưa bao gồm VAT 10%</p>
</div>
</div>
</div>
......@@ -166,7 +166,7 @@ get_header();
<h2>Tin tức nổi bật</h2>
<div class="row">
<?php foreach($recent_posts as $post) : ?>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 item">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 item wow slideInUp">
<div class="item-child" title="<?php echo $post['post_title'] ?>" >
<?php $img_url = get_the_post_thumbnail_url($post['ID']); ?>
<div class="img">
......@@ -187,7 +187,9 @@ get_header();
<div class="container">
<h2>Khách hàng và đối tác</h2>
<p class="desp">Nói về chúng tôi</p>
<?php echo do_shortcode('[testimonials_slider design_template="template-4" grid="3" show_company="true" image_style="circle" show_quotes="false" video="false" social="false" dots="true" arrows="false"]'); ?>
<div class="wow zoomInUp">
<?php echo do_shortcode('[testimonials_slider design_template="template-4" grid="3" show_company="true" image_style="circle" show_quotes="false" video="false" social="false" dots="true" arrows="false"]'); ?>
</div>
</div>
</div>
<?php get_footer(); ?>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment