I'm pulling my hair my code is working fine except on 1 page
the target div display like this in console
div#spin-area.spinner
instead of
<div id="spin-area" class="spinner"></div>
and spinner div is undefined console.log
var target = document.getElementById('spin-area');
var opts = {
lines: 13, // The number of lines to draw
length: 10, // The length of each line
width: 5, // The line thickness
radius: 45, // The radius of the inner circle
scale: 1, // Scales overall size of the spinner
corners: 1, // Corner roundness (0..1)
color: '#106CB6', // CSS color or array of colors
fadeColor: 'transparent', // CSS color or array of colors
speed: 1, // Rounds per second
rotate: 0, // The rotation offset
animation: 'spinner-line-fade-quick', // The CSS animation name for the lines
direction: 1, // 1: clockwise, -1: counterclockwise
zIndex: 2e9, // The z-index (defaults to 2000000000)
className: 'spinner', // The CSS class to assign to the spinner
top: '50%', // Top position relative to parent
left: '50%', // Left position relative to parent
shadow: '0 0 1px transparent', // Box-shadow for the lines
position: 'fixed' // Element positioning: fixed, absolute, relative
};
var spinner;
// start
function startSpin(){
spinner = new Spin.Spinner(opts).spin(target);
}
// stop
function stopSpin(){
spinner.stop();
}
I figured out
I have a async:false, in the AJAX part that was preventing the spinner to run correctly
Since I have commented //async:false,that fixed the target div
Hi,
I'm using https://spin.js.org/spin.umd.js
I'm pulling my hair my code is working fine except on 1 page
the target div display like this in console
div#spin-area.spinner
instead of<div id="spin-area" class="spinner"></div>
and spinner div is undefined console.loginstead of
What can cause this?
Here is my spin code