I want to put two effects with javascript in an image. the First would make the image appear to appear once and from there it would be glowing frequently. Is it possible?
<div id="logo">
<a href="index.html">
<img id="efeitoluz" src="https://cdn1.iconfinder.com/data/icons/ninja-things-1/720/ninja-background-256.png"alt="Demo" width="256" height="256" align="top" alt="Marca da W6 116x152" />
</a> </div>
Javascript
$(window).load(function() {
var colorsArray = new Array('#FBFAFA','#FBFAFA','#FBFAFA','#FBFAFA');
var colorInd = 0;
var directionArray = new Array('y');
var directionInd = 0;
$("#efeitoluz").shiningImage({
color: '#FBFAFA',
onLoopComplete: function()
{
colorInd++;
if (colorInd == colorsArray.length) {colorInd = 0;}
if (directionInd == directionArray.length) {directionInd = 0;}
$("#efeitoluz").data('shiningImage').settings.color = colorsArray[colorInd];
$("#efeitoluz").data('shiningImage').settings.direction = directionArray[directionInd];
},
opacity : 300
});
});
;(function($, window, document) {
var animation = 'tile';
var effect = '';
var options = {};
var lastChecked;
var lastChecked2;
function animate()
{
if($.isEmptyObject(options))
$('.code').text("$('.efeitoentrada').animate('" + animation + "');");
else
$('.code').text("$('.efeitoentrada').animate('" + animation + "', " + JSON.stringify(options, null, 2) + ");");
$('.efeitoentrada').animate(animation, options);
}
function update()
{
var isCombine = $('.combine').is(':checked');
}
function click()
{
var element = $('.' + $(this).attr('for'));
var animationId = element.attr('id');
$('.option-' + animationId).toggleClass('disable');
if(!element.is(':checked'))
{
if(element.parents('.effect').length > 0)
lastChecked = animationId;
else
lastChecked2 = animationId;
}
}
function addButton(key, container)
{
var checkbox = $('<input type="checkbox" class="animation-check"/>');
checkbox.attr('id', container + key).attr('animation', key);
var label = $('<label class="animation input"></label>');
label.text(key).attr('for', container + key).click(click);
$('.' + container).append(checkbox).append(label);
}
$(document).ready(function() {
for(var key in $.animations)
{
if(key == 'fn' || key == 'tile')
continue;
addButton(key, 'effects');
addButton(key, 'alternates');
}
$('.submit').click(animate);
$('body').on('change', 'input,select', update);
var img = $('.efeitoentrada')[0];
if(img.complete || img.readyState === 4)
blind();
else
$('.efeitoentrada').bind('load', blind);
$('.blind').click(blind);
});
function blind()
{
options = {
duration: 4000,
rows: 50,
sequent: false,
effect: 'slideFromDown'
};
animate();
}
})(jQuery, window, document);