南島咖啡 - 文化體驗活動
/* 按鈕 文字設計 */
.card .bton{
border: 2px solid #fff;
padding: 10px 30px;
color: #fff;
text-decoration: none;
transition: 0.6 ease;
margin: 10px 0 30px 0;
}
.card .bton:hover{
background-color: #fff;
color: #000;
}
.card-body h5,.card-body p {
color: white;
}
.card a {
text-decoration: none;
color:white;
}
/* 圖片放大效果 */
.pic{
overflow: hidden;
}
.card img{
transform: scale(1,1);
transition: all 1s ease-out;
}
.card img:hover{
transform: scale(1.2,1.2);
}
/* 40px */
.toTop-arrow {
width: 2.5rem;
height: 2.5rem;
padding: 0;
margin: 0;
border: 0;
border-radius: 33%;
opacity: 0.6;
background: #000;
cursor: pointer;
position:fixed;
right: 1rem;
bottom: 1rem;
display: none;
}
.toTop-arrow::before, .toTop-arrow::after {
width: 18px;
height: 5px;
border-radius: 3px;
background: #f90;
position: absolute;
content: "";
}
.toTop-arrow::before {
transform: rotate(-45deg) translate(0, -50%);
left: 0.5rem;
}
.toTop-arrow::after {
transform: rotate(45deg) translate(0, -50%);
right: 0.5rem;
}
.toTop-arrow:focus {outline: none;}
$(function(){ // 點擊 捲到網頁最上面 $('#BackTop').click(function(){ $('html,body').animate({scrollTop:0}, 333); }); $(window).scroll(function() { if ( $(this).scrollTop() > 300 ){ $('#BackTop').fadeIn(222); } else { $('#BackTop').stop().fadeOut(222); } }).scroll(); });