0

Hello,

I am trying to create a page with link like such:

page.php

<a href="#1">pic1</a>
<a href="#2">pic2</a>

the first page willbe page.php#1 and the second one will be page.php#2

In order to activate page 2 what file name should I create for page.php#2?

It has to be a different page from page.php#1

Am I able to create a page called page.php#2?

Thanks.

5
Contributors
10
Replies
12
Views
5 Years
Discussion Span
Last Post by Bachu
0

What did you type in this with page.php#1 and page.php#2 those are HTML anchors, which you can use to jump on the same page.

What you need is page.php?pic=1, page.php?pic=2 and so on...

0

It should be like an image gallery. So whenever someone click on the thumbnail the large picture in the center changes, I shouldn't see the second picture until someone click on the next thumbnail.

0

you can't really make a gallery like your talking about with PHP, at least I think. you need ajax or JS or the page will reload and jump around which is a poor design for a gallery. And far as the page.php?pic=2 can be almost anything you want it to be. Id's for queries and such or a pic but then you need code to choose and load the pic. Jquery would be good for a gallery. There are many plug-ins and has classess dedicated to ajax

0

You can use Apache mod rewrite to allow this type of thing (I think) in the url, but it's not a standard pattern that I've seen.

A better one IMO, would be

www.example.com/page/pics/1/
www.example.com/page/pics/2/

Your srcs are easy:

<img src="/page/pics/<?php echo $pic_id;?>/" ... />

Or any multitude of variations.

This could translate to www.example.com/page/pics/1/ = www.example.com/page.php?pics=1

Edited by diafol

0

Use Jquery ..
Try this ..
Exg:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gallery Exg</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body>
<a href="#page1" class="link" rel="1">pic1</a>
<a href="#page2" class="link" rel="2">pic2</a>
<div class="Page page1" style="display: none;">
<h1>Gallery-1</h1>
</div>
<div class="Page page2" style="display: none;">
<h1>Gallery-2</h1>
</div>
<script type="text/javascript">
$(function(){
    $('.link').click(function() {
        var divIndex = $(this).attr('rel');
        $('.Page').fadeOut();
        $('.page'+divIndex).fadeIn();
    });
});
</script>

</body>
</html>
0

Hmm.. it looks neat. It just the pic gallery move downward then come back upward when you click it.

Mine looks the same, is there anyway so that the pic gallery remains in place in the middle of switching?

Edited by davy_yg

0

Change this

$('.Page').fadeOut();
$('.page'+divIndex).fadeIn();

To

$('.Page').hide();
$('.page'+divIndex).show();
0

good one. Is there any way to make whenever it just start the page it automatically select the first option?

0

change this

<div class="Page page1" style="display: none;">
<h1>Gallery-1</h1>
</div>

To

<div class="Page page1" style="display: block;">
<h1>Gallery-1</h1>
</div>
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.