javascript - Photogallery previous button not functioning right -


i'm playing around learning javascript , trying make simple photo gallery. next button have works it's suppose advancing photo 1 @ time, when hit previous goes way first image instead of 1 image , can't quite figure out why. help.

it's in jsbin here: http://jsbin.com/unijet/2/edit

my code is:

html:

  <div id="navcontainer">   <span id="prev"><a href="" onclick="return prev_img();">prev</a></span>   <span id="pg"></span>   <span id="next"><a href="" onclick="return next_img();">next</a></span>   </div>    <div id="imgcontainer"><img src="" id="img"/></div>

js:

var prev = document.getelementbyid("prev"); var next = document.getelementbyid("next"); var imge = document.getelementbyid("img"); var page = document.getelementbyid("pg");      var imag = [     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/red-fox-manitoba_66703_990x742.jpg",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/martial-arts-india_66701_990x742.jpg?01ad=3ha8vz6-_sylzhh6qoaapo6cxs3ylip8x8qywogguawbdsuq9py9ljw&01ri=20fa22155e4e381&01na=na",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/666/cache/egret-reflection-florida_66697_990x742.jpg",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/tornado-storm-saskatchewan_66707_990x742.jpg",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/penguin-south-georgia-island_66702_990x742.jpg",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/sunset-south-africa_66706_990x742.jpg",     "http://images.nationalgeographic.com/wpf/media-live/photos/000/667/cache/man-motorbike-india_66710_990x742.jpg" ];  var = 0;  imge.setattribute("src",imag[i]); prev.innerhtml = "prev"; page.innerhtml = i;  function next_img() {     i++;     page.innerhtml = i;     imge.setattribute("src",imag[i]);      if (i == imag.length-1) {         next.innerhtml = "next";         prev.innerhtml = "<a href='' onclick='return prev_img();'>prev</a>";     } else {         next.innerhtml = "<a href='' onclick='return next_img();'>next</a>";         prev.innerhtml = "<a href='' onclick='return prev_img();'>prev</a>";     }     return false; }  function prev_img() {     i--;     page.innerhtml = i;     image.setattribute("src",imag[i]);      if (i === 0) {         prev.innerhtml = "prev";         next.innerhtml = "<a href='' onclick='return next_img();'>next</a>";     } else {         prev.innerhtml = "<a href='' onclick='return prev_img();'>prev</a>";         next.innerhtml = "<a href='' onclick='return next_img();'>next</a>";     }     return false; }

in prev_img() function change

image.setattribute("src",imag[i]);

to

imge.setattribute("src",imag[i]);

Comments

Post a Comment

Popular posts from this blog

Change php variable from jquery value using ajax (same page) -

what i'm trying this: i've php global variable $currentid , simple jquery script check if there "id" (page) in hash of url , if yes wanted give value $currentid . i've been reading lot , notice shall use ajax i'm not managing it. my code is: <script type="text/javascript"> $(document).ready(function(){ if (parent.location.hash != '' ) { var thecurrentid = parent.location.hash.split('#')[1]; $.ajax({ url: 'my.php', //current page type: 'post', data: {theid: thecurrentid }, datatype: 'json', success: function () { } }); } // code here }); </script> could me please? thank in advance. php server side language, meaning once has sent data browser, php variables , data cannot changed... however, using ajax, can send request php page , change data in dom based on result. consider th...
Read more

Pull out data related to my apps from Android Play Store and iOS App Store -

i want pull out data related apps (ratings, reviews, etc) google play store , apple app store ? how can accomplish ? i have found open source apis google mentioned not reliable. also there paid apis (e.g. appfigures) available. has idea how able pull data these play stores ?? i looking direction on how can accomplish this. can suggest ? we (appfigures) have been working on developing infrastructure give ability reviews , bunch of other data points major app stores several years :] we make available via our api though may want check out.
Read more

How can I fetch data from a web server in an android application? -

i want retrieve data web server in android application, , don't know begin. should use web services? i recommend these tutorials: connect android php , mysql , json in android , php , mysqli i used these tutorials , managed trying working without difficulty. between them describe each step in how attempting @ each stage, android application, database , web server side , has information included can process , use received information the thing add connect android php , mysql tutorial makes use of mysql_ in php deprecated. better use mysqli why included third link. the basic outline of want this: 1) in android app make request server php script using class this: import java.io.bufferedreader; import java.io.ioexception; import java.io.inputstream; import java.io.inputstreamreader; import java.io.unsupportedencodingexception; import java.util.list; import org.apache.http.httpentity; import org.apache.http.httpresponse; import org.apache.http.namevaluepair...
Read more