Question
needle2k opened this issue · comments
Thank you for this great Work, it really helped me alot !!!
Keep up the great work.
btw. if it´s included in another plugin to observe a change.
how do i use:
trackValues: true,
callback: function (event) {
............
}
from within another plugin.
if (settings.observeLightBoxOpen === true) {
$('#' + settings.lightBoxOpenSelector).attrchange(function(attrName) {
trackValues: true, // <--- fails
callback: function(e) { // <--- fails
if (e.newValue === 'block') {
console.log('Attribute: ' + attrName + ' modified ');
mouseEvent = true;
} else {
console.log('Attribute: ' + attrName + ' not modified ');
mouseEvent = false;
};
};
console.log('Attribute: ' + attrName + ' modified ');
});
};
Ok, I think you mixed up the old and new syntax.
Below is old syntax which accepts function arg,
attrchange(function (attrName) {
The new syntax is,
$(selector).attrchange({ trackValues: true, /* Default to false, if set to true the event object is updated with old and new value.*/ callback: function (event) { //event - event object //event.attributeName - Name of the attribute modified //event.oldValue - Previous value of the modified attribute //event.newValue - New value of the modified attribute //Triggered when the selected elements attribute is added/updated/removed } });
You can check out the demo and documentation http://meetselva.github.com/attrchange/
Note: $(selector).attrchange({
accepts an object. Even though the plugin does support the function arg for backward compatibility, it is recommended to use the new syntax.
Modify your code like below and give it a try,
if (settings.observeLightBoxOpen === true) { $('#' + settings.lightBoxOpenSelector).attrchange({ //removed the function trackValues: true, callback: function(e) { // This is the handler function if (e.newValue === 'block') { console.log('Attribute: ' + e.attributeName + ' modified '); mouseEvent = true; } else { console.log('Attribute: ' + e.attributeName + ' not modified '); mouseEvent = false; }; }; }); };
i´ll give it a try !
Thank you
Let me know if it worked for you.
Hi,
not really works on fetching it with your code, it logs that "display : none " (e.oldValue) has changed but i cannot fetch the new attribute with "e.newValue" -> "display: block"
if (settings.observeLightBoxOpen === true) {
$('#' + settings.lightBoxOpenSelector).attrchange({ //removed the function
trackValues: true,
callback: function(e) { // This is the handler function
console.log('Attribute: ' + e.attributeName + ' ' + e.oldValue + ' ' + e.attributeName + ' ' + e.newValue + ' changed ');
if (e.newValue === 'block') {
console.log('Attribute: ' + e.attributeName + ' ' + e.oldValue + ' ' + e.attributeName + ' ' + e.newValue + ' modified');
} else {
console.log('Attribute: ' + e.attributeName + ' ' + e.oldValue + ' ' + e.attributeName + ' ' + e.newValue + ' modified');
};
}
});
still using the old way (works):
if (settings.observeLightBoxOpen === true) {
$('#' + settings.lightBoxOpenSelector).attrchange(function(attrName) {
var currentDisplay = $('#' + settings.lightBoxOpenSelector).css('display');
if ( currentDisplay === 'block') {
mouseEvent = true;
} else {
mouseEvent = false;
}
});
}
it polls the output multiple time too