Easy as for jQuery GURUS!

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply

Join Date: Jul 2009
Posts: 23
Reputation: ablitz is an unknown quantity at this point 
Solved Threads: 0
ablitz ablitz is offline Offline
Newbie Poster

Easy as for jQuery GURUS!

 
0
  #1
34 Days Ago
Hi guys, I spent the whole day (thats 8 hours straight) trying to get a simple jQuery function to work but failed miserably!!! I very very new to the jQ scene and I know I have a lot of catching up to do!
Could somebody get this to work for me ???

All i want is when user clicks is:
1.the box with info fades out
2. when data returned from the database the box fades in with the new data!

What happens now is while the box fading out i can see new set of data already loaded and thats a complete FAIL of what I interned to do. ANY HELP IS GREATLY APPRECIATED! Peace.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. $(document).ready(function() {
  2.  
  3. $("ul.sc_menu a").click(function()
  4. {
  5.  
  6. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"});
  7.  
  8. $.post('projects-agent.php', {'title': $(this).text()}, function(data)
  9. {
  10. $('#content #mainbg #infobox #trackinfo').html(data);
  11. $('#content #mainbg #infobox #trackinfo').animate({opacity:"1"});
  12.  
  13. });
  14. return false;
  15. });
  16. });
Last edited by peter_budo; 31 Days Ago at 5:15 am. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks)
Reply With Quote Quick reply to this message  
Join Date: Jul 2006
Posts: 811
Reputation: pritaeas is on a distinguished road 
Solved Threads: 132
Sponsor
pritaeas's Avatar
pritaeas pritaeas is offline Offline
Practically a Posting Shark
 
0
  #2
34 Days Ago
It is possible to attach a callback function to the animate() function. This callback is called after the animation is done. Put your post in that function. See http://docs.jquery.com/Effects/animate
"If it is NOT source, it is NOT software."
-- NASA
Reply With Quote Quick reply to this message  
Join Date: Jul 2009
Posts: 23
Reputation: ablitz is an unknown quantity at this point 
Solved Threads: 0
ablitz ablitz is offline Offline
Newbie Poster
 
0
  #3
34 Days Ago
hi thank you for your reply, its easier said than done, i can't get the syntax right! could you please kindly rewrite the code? cheers
Reply With Quote Quick reply to this message  
Join Date: Jul 2009
Posts: 23
Reputation: ablitz is an unknown quantity at this point 
Solved Threads: 0
ablitz ablitz is offline Offline
Newbie Poster
 
0
  #4
34 Days Ago
This is what I've tried and it didnt work

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. $(document).ready(function() {
  2. soundManager.debugMode = false;
  3. $("ul.sc_menu a").click(function()
  4. {
  5. //$('#mainbg').fadeOut("slow");
  6. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"},function(){$.post('projects-agent.php', {'title': $(this).text()},function(data){$('#content #mainbg #infobox #trackinfo').html(data);$('#content #mainbg #infobox #trackinfo').animate({opacity:"1"})});
  7.  
  8. ;
  9.  
  10. threeSixtyPlayer.init();
  11. });
  12. return false;
  13. });
  14. });
Reply With Quote Quick reply to this message  
Join Date: Jul 2009
Posts: 23
Reputation: ablitz is an unknown quantity at this point 
Solved Threads: 0
ablitz ablitz is offline Offline
Newbie Poster
 
0
  #5
34 Days Ago
This is what I've tried and it didnt work

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. $(document).ready(function() {
  2. soundManager.debugMode = false;
  3. $("ul.sc_menu a").click(function()
  4. {
  5. //$('#mainbg').fadeOut("slow");
  6. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"},function(){$.post('projects-agent.php', {'title': $(this).text()},function(data){$('#content #mainbg #infobox #trackinfo').html(data);$('#content #mainbg #infobox #trackinfo').animate({opacity:"1"})});
  7.  
  8. ;
  9.  
  10. threeSixtyPlayer.init();
  11. });
  12. return false;
  13. });
  14. });
Reply With Quote Quick reply to this message  
Join Date: Jul 2009
Posts: 178
Reputation: codejoust is an unknown quantity at this point 
Solved Threads: 17
codejoust's Avatar
codejoust codejoust is offline Offline
Junior Poster
 
0
  #6
34 Days Ago
  1. $(function(){
  2.  
  3. $("ul.sc_menu a").click(function() {
  4. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"},
  5. function(){
  6. alert('animated');
  7. $.post('projects-agent.php', {'title': $(this).text()},
  8. function(data){
  9. alert(data);
  10. $('#content #mainbg #infobox #trackinfo').html(data);
  11. $('#content #mainbg #infobox #trackinfo').fadeIn('fast');
  12. });
  13. });
  14. return false;
  15. });
  16. });
Do the alerts go off with the code? It looked like a few syntax errors...
They should be cleaned up. Are you sure the php file is returning a http 200 and data? Also, I'd try to make sure you audioplayer is present.
Reply With Quote Quick reply to this message  
Join Date: Jul 2009
Posts: 23
Reputation: ablitz is an unknown quantity at this point 
Solved Threads: 0
ablitz ablitz is offline Offline
Newbie Poster
 
0
  #7
34 Days Ago
Originally Posted by codejoust View Post
  1. $(function(){
  2.  
  3. $("ul.sc_menu a").click(function() {
  4. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"},
  5. function(){
  6. alert('animated');
  7. $.post('projects-agent.php', {'title': $(this).text()},
  8. function(data){
  9. alert(data);
  10. $('#content #mainbg #infobox #trackinfo').html(data);
  11. $('#content #mainbg #infobox #trackinfo').fadeIn('fast');
  12. });
  13. });
  14. return false;
  15. });
  16. });
Do the alerts go off with the code? It looked like a few syntax errors...
They should be cleaned up. Are you sure the php file is returning a http 200 and data? Also, I'd try to make sure you audioplayer is present.
got it! thank you for your time and help!!
Reply With Quote Quick reply to this message  
Join Date: Aug 2006
Posts: 319
Reputation: Luckychap is on a distinguished road 
Solved Threads: 42
Luckychap's Avatar
Luckychap Luckychap is offline Offline
Posting Whiz
 
0
  #8
34 Days Ago
May this help
  1. $(document).ready(function() {
  2.  
  3. $("ul.sc_menu a").click(function()
  4. {
  5.  
  6. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"});
  7.  
  8. $.post('projects-agent.php', {'title': $(this).text()}, function(data)
  9. {
  10. //$('#content #mainbg #infobox #trackinfo').html(data);
  11. $('#content #mainbg #infobox #trackinfo').animate({opacity:"1"}, function(){this.html(data)});
  12.  
  13. });
  14. return false;
  15. });
  16. })
When you think you have done a lot, then be ready for YOUR downfall.
Reply With Quote Quick reply to this message  
Join Date: Aug 2006
Posts: 319
Reputation: Luckychap is on a distinguished road 
Solved Threads: 42
Luckychap's Avatar
Luckychap Luckychap is offline Offline
Posting Whiz
 
0
  #9
34 Days Ago
Even better:
  1. $(document).ready(function() {
  2.  
  3. $("ul.sc_menu a").click(function()
  4. {
  5. $('#content #mainbg #infobox #trackinfo').animate({opacity:"0"}, function(){
  6. $.post('projects-agent.php', {'title': $(this).text()}, function(data)
  7. {
  8. $('#content #mainbg #infobox #trackinfo').html(data);
  9. $('#content #mainbg #infobox #trackinfo').animate({opacity:"1"});
  10.  
  11. });
  12. return false;
  13. });
  14. });
  15. })
When you think you have done a lot, then be ready for YOUR downfall.
Reply With Quote Quick reply to this message  
Reply

Tags
animate, jquery

Message:



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC