var divs
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
var btn3 = document.getElementById("btn3");
btn1.onclick = function(event){
event.preventDefault();
toggleDivs("sect1",this);
};
btn2.onclick = function(event){
event.preventDefault();
toggleDivs("sect2",this);
};
btn3.onclick = function(event){
event.preventDefault();
toggleDivs("sect3",this);
};
function toggleDivs(s,btn){
if(btn.classList.contains("btn_active_state")){
document.getElementById(s).classList.remove("shown");
btn.classList.remove("btn_active_state");
document.getElementById(s).classList.remove("shown");
return;
}else{
btn1.classList.remove("btn_active_state");
btn2.classList.remove("btn_active_state");
btn3.classList.remove("btn_active_state");
document.getElementById("sect1").classList.remove("shown");
document.getElementById("sect2").classList.remove("shown");
document.getElementById("sect3").classList.remove("shown");
document.getElementById(s).classList.add("shown");
}
}
//Andy dari Weddingpress - Kodingan Spesial Fullpage
//Paksa Button1 Untuk Fokus or Klik jika di perlukan
//btn1.focus();
btn1.click();
.elementor-editor-active .hidden{
display:block;
}
.hidden{
display:none;
}
.shown{
display: block !important;
}
.btn_active_state{
background-color: #FFFFFF !important;
}
function toggleFullscreen(elem) {
elem = elem || document.documentElement;
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
}
document.getElementById('btnFullscreen').addEventListener('click', function() {
toggleFullscreen();
});
document.getElementsByClassName("wdp-button-wrapper").addEventListener('click', function() {
toggleFullscreen();
});
body {
background-color: #194B3F;
}
.goyang-1 img {
animation-name: goyang1;
animation-duration: 7s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.goyang-2 img {
animation-name: goyang2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.goyang-3 img {
animation-name: goyang3;
animation-duration: 7s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.goyang-4 img {
animation-name: goyang4;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.goyang-5 img {
animation-name: goyang5;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
.zoom-1 {
transform: scale(1);
animation: zoom 3s infinite;
}
.zoom-2 img {
transform: scale(1);
animation: zoom 2s infinite;
}
@keyframes goyang1{
0%{ transform: rotate(0deg) scale(1); }
50%{ transform: rotate(6deg) scale(1.18); }
100%{ transform: rotate(0deg) scale(1); }
}
@keyframes goyang2{
0%{ transform: rotate(0deg) scale(1); }
25%{ transform: rotate(-4deg) scale(1.05); }
50%{ transform: rotate(-8deg) scale(1.1); }
75%{ transform: rotate(-4deg) scale(1.05); }
100%{ transform: rotate(0deg) scale(1); }
}
@keyframes goyang3{
0%{ transform: rotate(0deg) scale(1); }
25%{ transform: rotate(8deg) scale(1.1); }
50%{ transform: rotate(-4deg) scale(1); }
75%{ transform: rotate(6deg) scale(1.1); }
100%{ transform: rotate(0deg) scale(1); }
}
@keyframes goyang4{
0%{ transform: rotate(0deg); }
25%{ transform: rotate(-6deg)scale(1.05); }
75%{ transform: rotate(4deg)scale(1.1); }
100%{ transform: rotate(0deg); }
}
@keyframes goyang5{
0%{ transform: rotate(0deg); }
25%{ transform: rotate(6deg)scale(1.05); }
75%{ transform: rotate(-4deg)scale(1.1); }
100%{ transform: rotate(0deg); }
}
@keyframes zoom {
0% { transform: scale(0.95); }
60% { transform: scale(1); }
100% { transform: scale(0.95); }
}