Skip to content

Commit

Permalink
no message
Browse files Browse the repository at this point in the history
  • Loading branch information
lmwfjb committed Apr 28, 2020
1 parent 7313c97 commit c5a0286
Show file tree
Hide file tree
Showing 2 changed files with 104 additions and 106 deletions.
107 changes: 1 addition & 106 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -241,113 +241,8 @@ <h3 class="card_title">紳士品味質感萬年筆 - 手磨鋼筆課程</h3>
</div>
<script src="js/jquery-3.4.1.min.js"></script>
<script src="js/bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
<script>
//header-----------------------
var header = $('.banner');
var range = 200;
<script src="js/index.js"></script>

if ($(window).width() > 768) {
$(window).on('scroll', function () {
var scrollTop = $(this).scrollTop(),
height = header.outerHeight(),
offset = height / 2,
calc = 1 - (scrollTop - offset + range) / range;
header.css({ 'opacity': calc });
if (calc > '2') {
header.css({ 'opacity': 1 });
} else if (calc < '0') {
header.css({ 'opacity': 0.2 });
}
});
}
//header-----------------------


// gallery-----------------------
var $sm = 480;
var $md = 768;

function resizeThis() {
$imgH = $('.middle img').width();
if ($(window).width() >= $sm) {
$('.left,.right,.section').css('height', $imgH);
} else {
$('.left,.right,.section').css('height', 'auto');
}
}
resizeThis();

$(window).resize(function () {
resizeThis();
});
$(window).scroll(function () {
$('.section').each(function () {
var $elementPos = $(this).offset().top;
var $scrollPos = $(window).scrollTop();
var $sectionH = $(this).height();
var $h = $(window).height();
var $sectionVert = (($h / 2) - ($sectionH / 4));
if (($elementPos - $sectionVert) <= $scrollPos && ($elementPos - $sectionVert) + $sectionH > $scrollPos) {
$(this).addClass('animate');
} else {
$(this).removeClass('animate');
}
});
});
// gallery----------------------


// course-----------------------
// $('.card').click(function () {
// $(this).toggleClass('flipped');
// });
$(".flip_border").click(function () {
if ($(this).parent().hasClass("flip_to_back")) {
$(this).parents(".card_inner").addClass("flip");
} else {
$(this).parents(".card_inner").removeClass("flip");
}
})

// course-----------------------


// toTop-----------------------
$(window).scroll(function () {
if ($(this).scrollTop() != 0) {
$("#toTop").fadeIn();
} else {
$("#toTop").fadeOut();
}
});
$("#toTop").click(function () {
$("body,html").animate({
scrollTop: 0
}, 800);
});
// toTop-----------------------

// animation-----------------------
$(function () {
$(window).scroll(function () {
var y = $(this).scrollTop();
if (y > 700) {
$('.content-area .text').addClass('animate');
};
});
});//banner

$('.menu_container a').click(function () {
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top
}, 300);
return false;
})//to id below




</script>
</body>

</html>
103 changes: 103 additions & 0 deletions js/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
{
//header-----------------------
let header = $('.banner');
let range = 200;

if ($(window).width() > 768) {
$(window).on('scroll', function () {
var scrollTop = $(this).scrollTop(),
height = header.outerHeight(),
offset = height / 2,
calc = 1 - (scrollTop - offset + range) / range;
header.css({ 'opacity': calc });
if (calc > '2') {
header.css({ 'opacity': 1 });
} else if (calc < '0') {
header.css({ 'opacity': 0.2 });
}
});
}
//header-----------------------


// gallery-----------------------
let $sm = 480;
let $md = 768;

function resizeThis() {
$imgH = $('.middle img').width();
if ($(window).width() >= $sm) {
$('.left,.right,.section').css('height', $imgH);
} else {
$('.left,.right,.section').css('height', 'auto');
}
}
resizeThis();

$(window).resize(function () {
resizeThis();
});
$(window).scroll(function () {
$('.section').each(function () {
let $elementPos = $(this).offset().top;
let $scrollPos = $(window).scrollTop();
let $sectionH = $(this).height();
let $h = $(window).height();
let $sectionVert = (($h / 2) - ($sectionH / 4));
if (($elementPos - $sectionVert) <= $scrollPos && ($elementPos - $sectionVert) + $sectionH > $scrollPos) {
$(this).addClass('animate');
} else {
$(this).removeClass('animate');
}
});
});
// gallery----------------------


// course-----------------------
// $('.card').click(function () {
// $(this).toggleClass('flipped');
// });
$(".flip_border").click(function () {
if ($(this).parent().hasClass("flip_to_back")) {
$(this).parents(".card_inner").addClass("flip");
} else {
$(this).parents(".card_inner").removeClass("flip");
}
})

// course-----------------------


// toTop-----------------------
$(window).scroll(function () {
if ($(this).scrollTop() != 0) {
$("#toTop").fadeIn();
} else {
$("#toTop").fadeOut();
}
});
$("#toTop").click(function () {
$("body,html").animate({
scrollTop: 0
}, 800);
});
// toTop-----------------------

// animation-----------------------
$(function () {
$(window).scroll(function () {
let y = $(this).scrollTop();
if (y > 700) {
$('.content-area .text').addClass('animate');
};
});
});//banner

$('.menu_container a').click(function () {
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top
}, 300);
return false;
})//to id below
}

0 comments on commit c5a0286

Please sign in to comment.