/    Sign up×
Community /Pin to ProfileBookmark

Javascript Tweaking for Next/Previous

Copy linkTweet thisAlerts:
Jul 26.2005

Hopefully I can explain this correctly. I have been looking everywhere for a java script that will allow Next and Previous buttons that do not run on History viewed. I found a script here on the website that works great for what we wanted. We can’t use PHP here at the plant so I turned to Java in HTML. (Boss likes MS). My problem is that the next and previous script is written for images that start like 1.jpg. It then allows the next link to pull the images up in order such as 2.jpg, 3.jpg. The problem is that our images here have to be 0001.jpg up to 10000.jpg. I am not a great web programmer with Java, but can muddle by. I am assuming the problem is coming from this line? : var newNumber = RegExp.$1*1+number; I tried playing with the Varnumber and increasing it from 001/999 to 0001/9999, but that just breaks the viewing.

Can anyone help me to identify what needs to be changed in this script so it will work with our image naming conventions?

Thanks
Sin

Here is the original script I found here from another user:
<script type=”text/javascript”>
<!–//
function changePage(number){
var firstNumber = 001;
var lastNumber = 999;
var content = document.getElementById(‘content’);
var oldNumber = content.src.match(/(d+)(?=.)/);
var newNumber = RegExp.$1*1+number;

if(newNumber < firstNumber){ newNumber = lastNumber };
if(newNumber > lastNumber) { newNumber = firstNumber };
content.src = content.src.replace(/(d+)(?=.)/,newNumber);
document.getElementById(‘test’).innerHTML = content.src;
}
//–>
</script>

</head>

<body>
<a href=”#” class=”link” onclick=”changePage(-1)”>Back</a>
<a href=”#” class=”link” onclick=”changePage(+1)”>Forward</a>
<div><iframe id=”content” src=”0001.jpg” style=”height:800; width:800″></iframe></div>
<div id=”test”></div>

to post a comment
JavaScript

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@Jonny_LangJul 27.2005 — [CODE]<HTML>
<Head>
<Script Language=JavaScript>

var nImgs = 10000; // number of images
var curr = 0099; // demo starting image

function turnPage(direction){

if (direction == 'next'){if (curr < nImgs){curr++} else {curr = 0001}}
if (direction == 'prev')
{
if (curr > 1){curr--}
else if (curr == 1){curr = nImgs}
}
if (curr < nImgs)
{
tmp = curr.toString();
padding = 4-tmp.length
if (padding > 0)
{
for (i=0; i<padding; i++){tmp = "0"+tmp}
}
}
else {tmp = curr}
document.getElementById('slideImg').src = "images/"+tmp+".jpg";
alert(tmp);
}

</Script>
</Head>
<body>
<table border="0" cellpadding="0" align='center'>
<TR>
<TD><Img Src='images/0001.jpg' id='slideImg'></TD>
</TR>
<TR>
<TD align='center'><br><input type=button value="Prev" onClick="turnPage('prev')">&nbsp;&nbsp
<input type=button value="Next" onClick="turnPage('next')"></TD>
</TR>
</table>
</body>
</html>[/CODE]
Copy linkTweet thisAlerts:
@SindarinauthorJul 27.2005 — Thanks Jonny!

That was exactly what I needed. Its woking perfectly. I appreciate your help.

Thanks

Sin
Copy linkTweet thisAlerts:
@Jonny_LangJul 27.2005 — You're welcome.
Copy linkTweet thisAlerts:
@AmeliaOlivDec 18.2008 — Super... Works perfectly !
Copy linkTweet thisAlerts:
@som79Jan 08.2009 — what if you post the same in the same page other than on dialog box ?
Copy linkTweet thisAlerts:
@akkadIIJan 08.2009 — very nice Jonny Lang.

I'm trying to use this for a JSON data source, but I don't know how to combine these two functions, yours and this:

[CODE]<script type="text/javascript">
function dapp(obj) {
var i=0;
var pic=(obj.groups.insider_xmas[i].pic[0].src);
var title=(obj.groups.insider_xmas[i].gossip[0].value);
var desc=(obj.groups.insider_xmas[i].desc[0].value);
var page=(obj.groups.insider_xmas[i].pic[0].href);
var divx=("<img src="+pic+" style:float:left><p><a href="+page+" target=_blank>"+title+"<br></a></p><div>"+desc+"<br></div><br><br><hr><br><br>");
document.write(divx);

i++; }
}


</script>[/CODE]

In the function above the variable that should be replaced by 'curr' is 'i'. My problem is that the function I have can't be named otherwise than 'dapp(obj)' because [I]dapp[/I] is the callback from a json link.



Oops, Jonny Lang was banned in the meantime. Anyone else can help ?
Copy linkTweet thisAlerts:
@obrienniNov 01.2010 — How would you change this so that previous takes you to the previous post or page and next takes you to the next post or page?
×

Success!

Help @Sindarin spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...