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.
