jquery animation in function not working

Question

I have a function that is called in a onclick in my <img> that calls.

function opengal(id){
    document.getElementById('gal_img').innerHTML="<img id='gal_active' src='" + imgs_array[id].source_t + "' />";
    gal_id = id;
    $(document).ready(function(){
        showId('gal');
        showId('gal_back');
        $('gal').fadeTo(3000, 1);
        $('gal_back').fadeTo(3000, 0.9);
        if (gal_id + 1 === imgs_array.length) {
            $('next').fadeTo(3000, 0);
            hideId('next');
            showId('prev');
            $('prev').fadeTo(3000, 1);
        } else if (gal_id === 0) {
            $('prev').fadeTo(3000, 0);
            hideId('prev');
            showId('next');
            $('next').fadeTo(3000, 1);
        } else {
            showId('prev');
            showId('next');
            $('next').fadeTo(3000, 1);
            $('prev').fadeTo(3000, 1);
        }
    });
}

The showId and hideId calles a document.getElementById(id).style.visibility="" to show the elements that are hidden for a slideshow-like gallery that is set above the rest of the page. after it shows these elements its suppose to change its opacity to fadeIn the element. The elements are being shown, but not the animation.

I think the cause is because the function is called outside the rest of my $(document).ready() as the imgs are generated in php for loop for displaying images from my database, with each image having its own id and calling its own opengal(id)

Anoop Joshi P · Accepted Answer · 2014-04-07 06:54:35Z

1

Because you forgot to put the id selector in jquery,#, Change your code like,

$('#gal').fadeTo(3000, 1);
$('#gal_back').fadeTo(3000, 0.9);

If you want to refer the elements using class name, use ., Then your code will be

$('.gal').fadeTo(3000, 1);
$('.gal_back').fadeTo(3000, 0.9);

answered Apr 7, 2014 at 6:54

Anoop Joshi P

25.6k9 gold badges35 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Drew Over a year ago

Well I feel like an idiot missing that. lol, funny how you miss the simple things.

Anoop Joshi P Over a year ago

I will prefer one more thing, you can directly use $('#gal').hide() and $('#gal').show() instead of calling a function

Collectives™ on Stack Overflow

jquery animation in function not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related