I take that back -- you're declaring it without the 'var' keyword so the scope is global.
On Thu, Jun 17, 2010 at 7:22 PM, Tim Romano <[email protected]> wrote: > If variable *photo* is declared inside the load() function, its scope is > local to the load() function; inside myTouch() it will be undefined. Photo > would either have to be declared outside a function as a global, or you > could pass it to myTouch() as an argument by myTouchEnd() if the touches > array gives you access at that juncture to the DIV element you are trying to > move. > > Regards > Tim Romano > Swarthmore PA > > > > > > On Thu, Jun 17, 2010 at 5:47 PM, Glyn Szasz <[email protected]>wrote: > >> The variable 'photo' is declared in the load function (which is run when >> the html page is loaded according to the body onLoad) >> Hope that helps. >> >> Glyn >> >> On 18/06/2010, at 3:56 AM, Tim Romano wrote: >> >> Glyn, >> I am even newer, and was looking at your code to learn a little. Where is >> variable 'photo' declared to make it visible inside function myTouch()? >> Regards >> Tim Romano >> Swarthmore PA >> >> On Wed, Jun 16, 2010 at 8:36 AM, Glyn Szasz <[email protected]>wrote: >> >>> Hi All, >>> >>> I am very new to this world of web dev using webkit, javascript and css. >>> >>> I am trying to make an element on my page move when I swipe across the >>> iPad. I can capture the swipe and get the direction of the move. If I set my >>> img to have an id="myPhoto" the img element will move but when I move the >>> id="myPhoto" to a div or any other element (such as a ul) I get no movement >>> even though the swipe has been registered. >>> >>> I hope that this is the correct list to post this question to. If not >>> could you please point me in the direction. >>> >>> Thanks in advance, >>> Glyn Szasz >>> Sydney, Australia >>> >>> This is my html: >>> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> >>> <html> >>> <head> >>> <title>My Test</title> >>> <meta content="yes" name="apple-mobile-web-app-capable"> >>> <meta name="apple-mobile-web-app-status-bar-style" content=" >>> black" /> >>> <meta content="minimum-scale=1.0, width=device-width, >>> maximum-scale=0.6667,user-scalable=no" name="viewport"> >>> <link href="css/glynstyle.css" rel="stylesheet" type="text/css"> >>> <script src="javascript/main.js" type="text/javascript" language >>> ="JavaScript"> >>> </script> >>> </head> >>> <body id="theBody" onLoad="load();"> >>> <div id="myPhoto"> >>> <p>my paragraph<br>more text</p> >>> <img src="pages/ipad_vert1.JPG" alt="ipad_vert1" width="768" height >>> ="1023"> >>> </div> >>> </body> >>> </html> >>> >>> This is the javascript: >>> function load() >>> { >>> photo = document.getElementById("myPhoto"); >>> photo.addEventListener("touchstart", myTouchStart, false); >>> photo.addEventListener("touchend", myTouchEnd, false); >>> i =0; >>> } >>> >>> function myTouchStart(event) { >>> event.preventDefault(); >>> touchXstart = event.touches[0].clientX; >>> targetID = event.touches[0].target.id; >>> // alert(targetID+" is targetID"); >>> } >>> >>> function myTouchEnd(event) { >>> event.preventDefault(); >>> touchXend = event.changedTouches[0].clientX; >>> myTouch(); >>> } >>> >>> function myTouch() { >>> >>> //whatMoveX = photo.x; >>> TouchDist = touchXstart - touchXend; >>> var currentPos = photo.x; >>> if (TouchDist >= 0) { >>> i = i-1; >>> moveDist = -(currentPos-100)*i; >>> photo.style.webkitTransform ='translateX('+moveDist+'px)'; >>> //alert("swipe right"); >>> } else { >>> i = i+1; >>> moveDist = (currentPos+100)*i; >>> photo.style.webkitTransform ='translateX('+moveDist+'px)'; >>> >>> // alert("swipe is left"); >>> } >>> alert(i); >>> } >>> >>> >>> This is the css: >>> body { >>> >>> margin: 0px; >>> padding: 0px; >>> background-color: #b9b9b9; >>> >>> } >>> >>> #myPhoto { >>> -webkit-transition: all 1s; >>> } >>> >>> >>> -- >>> You received this message because you are subscribed to the Google Groups >>> "iPhoneWebDev" group. >>> To post to this group, send email to [email protected]. >>> To unsubscribe from this group, send email to >>> [email protected]<iphonewebdev%[email protected]> >>> . >>> For more options, visit this group at >>> http://groups.google.com/group/iphonewebdev?hl=en. >>> >> >> >> -- >> You received this message because you are subscribed to the Google Groups >> "iPhoneWebDev" group. >> To post to this group, send email to [email protected]. >> To unsubscribe from this group, send email to >> [email protected]. >> For more options, visit this group at >> http://groups.google.com/group/iphonewebdev?hl=en. >> >> >> -- >> You received this message because you are subscribed to the Google Groups >> "iPhoneWebDev" group. >> To post to this group, send email to [email protected]. >> To unsubscribe from this group, send email to >> [email protected]<iphonewebdev%[email protected]> >> . >> For more options, visit this group at >> http://groups.google.com/group/iphonewebdev?hl=en. >> > > -- You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
