Solved

Load a gif to run then after it has ran 2x load default image

Posted on 2013-05-16
5
249 Views
Last Modified: 2013-05-20
I would like to run a homerun gif file 2x then load LayoutField.png back

it's like if("HR" == $(d.find('Batter')).attr("Action") imgDiamond = 'homerun.gif';
if ($(d.find('Batter')).attr("Action") === "HR") { 
                //  clearInterval(myVar); //stop refreshing the page every two seconds
               //   imgDiamond.src = 'homerun.gif';
                ///  var t = setTimeout(function(){ //imgDiamond.src = 'LayoutField.png'; myVar = //setInterval(loadData, 2000); }, 5000); 

Open in new window


Attached is a xml file with homerun set in xml AND HOMERUN.GIF AND LAYOUTFIELD.PNG
Diamond3.htm
Homerun.gif
LayoutField.png
38086.xml
0
Comment
Question by:powerztom
  • 3
  • 2
5 Comments
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
ID: 39174108
if ($(d.find('Batter')).attr("Action") === "HR") {
  imgDiamond.src = 'homerun.gif';
  var t = setTimeout(
     function() {
       imgDiamond.src = 'homerun.gif';    
       var u = setTimeout(function() {
           imgDiamond.src = 'LayoutField.png';    
        },1000);
    },1000);
}

or use jQuery QUEUE
0
 

Author Comment

by:powerztom
ID: 39174923
I made a simple web page with baseball diamond and Homerun.gif doesn't display I set xml to action ="HR" Am I missing somethingattached are necessary files for simple page page

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
.topcell {  text-align: center;
  vertical-align: top;
}
</style>
</head>
<script type="text/javascript">
$.ajax({
                    type: "GET",
                    url: "38086.xml", // xmlPath+"/"+xmlGameID+".xml",
                    dataType: "xml",
                    success: function(data){
                        var d = $(data);
                        
						if ($(d.find('Batter')).attr("Action") === "HR") { 
  imgDiamond.src = 'homerun.gif';
  var t = setTimeout(
     function() { 
       imgDiamond.src = 'homerun.gif';     
       var u = setTimeout(function() { 
           imgDiamond.src = 'LayoutField.png';     
        },5000);
    },5000);
						
						 }
                    }
                });
 
            
			
            error: function() {
                    //counterXml = -1;
            }
        
    

</script>
<body>
<span class="topcell"><img src="LayoutField.png" alt="" name="imgDiamond" width="186" height="162" id="imgDiamond"></span>
</body>
</html>

Open in new window

LayoutField.png
Homerun.gif
Test.html
38086.xml
0
 

Author Closing Comment

by:powerztom
ID: 39176119
Works except it doesn't go back to default image it runs homerun.gif back stays on that file
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39176635
I would expect code like this

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
.topcell {  text-align: center;
  vertical-align: top;
}
</style>
</head>
<script type="text/javascript">
$(function() {
   $.ajax({
     type: "GET",
     url: "38086.xml", // xmlPath+"/"+xmlGameID+".xml",
     dataType: "xml",
     success: function(data){
       var d = $(data);
       if ($(d.find('Batter')).attr("Action") === "HR") { 
         $("#imgDiamond").attr("src","homerun.gif");
         var t = setTimeout(
           function() { 
             $("#imgDiamond").attr("src","homerun.gif");
             var u = setTimeout(function() { 
               $("#imgDiamond").attr("src","LayoutField.png");     
             },5000);
          },5000);
			 }
    },
    error: function() {
      //counterXml = -1;
    }
  });
});
</script>
<body>
<span class="topcell"><img src="LayoutField.png" alt="" name="imgDiamond" width="186" height="162" id="imgDiamond"></span>
</body>
</html>

Open in new window

0
 

Author Comment

by:powerztom
ID: 39181126
Thanks Bro I'll try it.
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question