javascript - Can't use divs from success function in AJAX -


i don't know why won't work me.

  }).success(function(data){     if(data.status == 'success'){             // $("#useravatar").empty();                  for(i = 0;i < data.id.length; i++){             $("#useravatar").prepend('<div id="av'+data.id[i]+'" class="avatar">'+data.avatar[i]+'</div>');             var dropdiv = $('#av'+data.id[i]);  // code here dont work. no error. tried alert(data.id[i]); , fine.          dropdiv.css({         left: 130,         top: -190,         opacity: 0,         display: 'inline'     }).animate({         left: 5,         top: 10,         opacity: 1     }, 7000, 'easeoutbounce');              }              }  });

if use code alone:

  var dropdiv = $('#useravatar');            dropdiv.css({         left: 130,         top: -190,         opacity: 0,         display: 'inline'     }).animate({         left: 5,         top: 10,         opacity: 1     }, 7000, 'easeoutbounce');

will work div.

my question why first divs not working? how can make let div drop down animation?

edit:

i have tried above code in same file that: didn't work (the second function not called or not doing anything). 

 function getchatuser() {     $.ajax({        type: "post",        url: "../users/process.php",        data: {getchatuser: "getchatuser"},        cache: false,        datatype: 'json',        async: false     }).success(function (dat) {           if (dat.status == 'success') {               //$("#useravatar").empty();                  (i = 0; < dat.id.length; i++) {                    $("#useravatar").prepend('<div id="av' + dat.id[i] + '" class="avatar">' + dat.avatar[i] + '</div>');                   dropdivs(dat.id[i]);          }     }    });   }   function dropdivs(iddiv) {        // alert(iddiv); ----------> try , works got 112      dropdiv = $('#av' + iddiv);      dropdiv.css({                  left: 130,                   top: -190,               opacity: 0,               display: 'inline'          }).animate({                  left: 5,                   top: 10,               opacity: 1      }, 7000, 'easeoutbounce');   } 

    var dat = {         id: [1, 2, 3, 4],         avatar: ['https://cdn2.iconfinder.com/data/icons/male-users-2/512/1-32.png',             'https://cdn2.iconfinder.com/data/icons/male-users-2/512/14-32.png',             'https://cdn2.iconfinder.com/data/icons/male-users-2/512/8-32.png',             'https://cdn2.iconfinder.com/data/icons/male-users-2/512/2-32.png']     };      (i = 0; < dat.id.length; i++) {         $("#useravatar").prepend($('<div id="av' + dat.id[i] + '" class="avatar"><img src="' + dat.avatar[i] + '" alt="" /></div>').css({             left: 130,             top: -190,             opacity: 0         }).delay(i * 50).animate({             left: 5,             top: 0,             opacity: 1         }, 1500, 'easeoutbounce', function () {          }));     }

Comments

Post a Comment

Popular posts from this blog

apache - Remove .php and add trailing slash in url using htaccess not loading css -

i have add following code htaccess file removing .php extension , add trailing slash urls. worked fine reduced page loading speed , css code not loading @ all. pages ugly. please help rewriteengine on rewritebase / ## hide .php extension snippet # externally redirect /dir/foo.php /dir/foo rewritecond %{the_request} ^[a-z]{3,}\s([^.]+)\.php [nc] rewriterule ^ %1/ [r,l] # add trailing slash rewritecond %{request_filename} !-f rewritecond %{request_uri} !/$ rewriterule . %{request_uri}/ [l,r=301] # internally forward /dir/foo /dir/foo.php rewritecond %{request_filename} !-d rewritecond %{request_filename}.php -f rewriterule ^(.*?)/?$ $1.php [l] we can rewrite urls using .htaccess files. before writing in .htaccess files need verify kind of server using. can check server adding a <?php phpinfo(); ?> in php page. ensure mod_rewrite module enabled in apache server. can identified checking phpinfo included page. common methods used url rewriting follows ...
Read more

javascript - jQuery show full size image on click -

pretty self explanatory not workking . i want display full image when user click on image... yes know there tons of plugins but i want keep simple. any idea ? css : .full { display: none; width: 500px; height: 500px; margin-left: 100px; margin-top: -300px; position: fixed; background-color: #f00; z-index: 6; } .thumbnail { width: 50px; height: 50px; } html: <img class="thumbnail" src="http://4.bp.blogspot.com/-uhbdp2esxng/txneptvi92i/aaaaaaaaaky/upfqis7zto0/s1600/rihanna-wallpaper.jpg"> jquery: $(document).ready(function() { $('.thumbnail').on('click', function() { var img = $('<img />',{src:this.src,'class':'full'}); $('.full').html(img).show(); console.log('done!'); }); }); try looking how jquery works. $(document).ready(function() { $('.thumbnail').on('click', function(...
Read more