#sec3 .tab-content { padding-top: 40px; background: var(--c-assist2-01); background: linear-gradient(180deg, var(--c-assist2-01) 0%, var(--c-assist2-01) 50%, var(--c-assist2-00) 90%); } #sec3 .tab-content .col-12 { text-align: center; margin-bottom: 20px; transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); } #sec3 .tab-content img { cursor: pointer; transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); border-radius: 10px; max-width: 100%; height: auto; display: block; margin: 0 auto 10px; }
CSS 部份
.scale_s { transform: scale(0.9); opacity: 0.2; } .scale_b { transform: scale(1.1); } .scale_b img { box-shadow: 0 0 10px 3px var(--c-assist2-03); }
JS 部份
$('#sec3 .col-12').hover( function(){ $('#sec3 .col-12').not(this).addClass('scale_s'); $(this).addClass('scale_b'); }, function(){ $('#sec3 .col-12').removeClass('scale_s').removeClass('scale_b'); } );