Password for hyperlink/image rollover

[scriggs]

Hi

I have a webpage with thumbnail images which are previewed when you click on them using HTML

<img src="files/plan5small.jpg" alt="Plan5" width="100" onmouseover="plan.src='files/plan5.jpg';" onmouseout="plan.src='files/plan5.jpg';">

I am trying to password protect the preview function, any ideas how to do such a thing? Could be an inputbox when clicked/rollover or could be a login and session on the page.

Any pointers please.

Scriggs

 

[dkdude]

If you're on Apache webserver, then place the images in a .httaccess protected folder. Then the browser will launch the logon dialog when loading the images.

 

[vacunita]

The hidden login box would be easily produceable via a hidden DIV that pops up on mouseclick and then redirects to the preview.

Of course this is all treading into Javascript territory.

You style a DIv as the login box using CSS, and set its displat style to hidden. the using JS you change the style to block so it becomes visible.

The submit button then redirects to wherever the preview is to be shown, after checking the password is a correct and valid one.







----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[scriggs]

Thanks for the replies. For a quick short term solution I have gone with htaccess protection, but the interface is not that pretty.

I was hoping to set something up with session variables and a form, so that once logged in I can carry around the site. The problem I am hitting is two places:

1. I want most of the site accesable if not logged in, only a few bits on a few pages excluded. I was thinking I could do a:

unresticted data on page
if($password=="password") {show pitcures} else {dont show pictures}
unresticted data on page

2. I have tried various iterations of above, but my pages are made up of multiple include statements and variables don't seem to be carrying across into the includes.

Thanks.

 

[jpadie]

instead of directing the mouseover event to the actual file you want, why not direct it to a php file in an unprotected directory with a query string. eg:

<img src="files/plan5small.jpg" alt="Plan5" width="100" onmouseover="plan.src='image.php?file=protected/files/plan5.jpg';" onmouseout="plan.src='files/plan5small.jpg';">

the image.php file would then look like this

session_start();
if (loggedin()) { //or whatever your login test is
 if (file_exists($_GET['file'])){
  readfile($_GET['file']);
  }else {
  //show a file not exists image
  }
} else{
 //show a "must log in " image
}

better still would be to combine the above with the mouseover code not being passed to the browser for non-logged in clients.