PDA

View Full Version : Hide a script by another



lio
03-30-2009, 08:30 PM
1) Script Title: Image Thumbnail Viewer II & Swiss Army Image Slideshow

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm
http://www.dynamicdrive.com/dynamicindex14/swissarmy/index.htm

3) Describe problem: I try to generate the enlarged images from the thumnailviewer in the same container than this of the slideshow (that should be hidden)

I have tried with that script (based one another post where I was trying to combine 2 other scripts) but it does not work :o



<script type="text/javascript">
$(function(){
$('#motiongallery img').click(function(){
$('.show').hide();
$('#' + $(this).attr('name')).show();
});
});
</script>


Thanks for any help ;)

jscheuer1
03-31-2009, 01:42 PM
The code quoted in your post uses the jQuery script library. Do you have it associated with your page?

If so, your code will execute as written. However, what it says to do is that onclick of any image tag within the unique element with the id of 'motiongallery' the element(s) with the class of 'show' should be hidden and the unique element with the id of the name attribute of the image that was clicked should be shown.

By itself, this might not do anything, or might not do what is intended, because you would also have to have other markup and styles on the page to support it.

Even assuming you have all that, I kind of doubt that's exactly what you want to have, considering the scripts you say you are working with. If it is indeed workable with the scripts you said it was originally being used with, it could probably be adapted. I have my doubts even on that score, because name attributes and ids often get confused in IE, so while others may be fine with it, IE may have a problem. But, since jQuery is involved, that library may sort out that mess for you in IE, I've just never tried it.

If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

lio
03-31-2009, 03:50 PM
The idea was to have on one page a slideshow, and to give the possibility to have direct access to a photo by clicking on a thumb. The enlarged photo should be shown in the same container and stop the slideshow. Idealy, the slideshow starts again from that photo when the user clicks on "play" :rolleyes:

My first problem is that the enlarged image from a thumb doesn't want to go in the div the slideshow :o

Here the code based on the Swiss Army Slideshow and the Image Thumbnail Viewer II :



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
* {
font-family:arial;
font-size:10pt;
}
div#show3 {
background-color:#efefef;
width:140px;
margin:0 auto;
border:1px solid #444444;
}

</style>

<!--[if IE]>
<style type="text/css">
div#show3 table td, div#show4 table td {
height:21px;
}
</style>
<![endif]-->

<script type="text/javascript">

var preload_ctrl_images=true;

var previmg='left.gif';
var stopimg='stop.gif';
var playimg='play.gif';
var nextimg='right.gif';

var slides=[]; //FIRST SLIDESHOW
slides[0] = ["photo1.jpg", "Kissing Fools"];
slides[1] = ["photo2.jpg", "Seated Woman"];

</script>

<script src="swiss_2.js" type="text/javascript">
</script>

<script type="text/javascript" src="thumbnailviewer2.js" defer="defer">
</script>

<script type="text/javascript">
$(function(){
$('#thumbs img').click(function(){
$('.show').hide();
$('#' + $(this).attr('name')).show();
});
});
</script>

</head>

<body>
<div id="show">
<script type="text/javascript">
new inter_slide(slides)
</script>

<div id="thumbs">
<a href="photo1.jpg" rel="enlargeimage::click" rev="show"><img src="thumb1.jpg" border=0></a><br />
<a href="photo2.jpg" rel="enlargeimage::click" rev="show"><img src="thumb2.jpg" border=0></a><br />
</div>

</body>
</html>

jscheuer1
03-31-2009, 04:43 PM
I think you want vfs:

http://home.comcast.net/~jscheuer1/side/vfs/vac_plain.htm

You don't need to use all of the elements, and they may be positioned wherever you like on the page.

lio
03-31-2009, 05:01 PM
Yes ! Thanks :)

jscheuer1
03-31-2009, 05:10 PM
You'll probably have some questions, but try to get a demo of sorts up for me to look at, I work so much better that way. If you need help getting the basic files though, here's the link to vfs:

http://home.comcast.net/~jscheuer1/side/vfs/vfs_min.js

The lightbox add on, if you want to use that must use this version of lightbox:

http://home.comcast.net/~jscheuer1/side/lightbox2.04a/lightbox2.04a.zip

A customization of the current official release, which I introduced here:

http://www.dynamicdrive.com/forums/showthread.php?p=163470#post163470

But you don't need that if you're not using it. It's only for an even larger version of the images to appear in an overlay when the large version in the slide show is clicked. If you don't use lightbox, you may optionally link those larger images.

lio
04-02-2009, 08:52 PM
So, I have played with the different parameters... and need help again.
It takes me time... ;)
Here is the prototype :
http://lionel122.free.fr
I would like to have the thumbs in a "C Motion Image Gallery". As you see it does not work... what is wrong in the code ??
Then, I will customize the buttons and try to add comments for each photo :rolleyes:

auntnini
04-03-2009, 12:33 AM
http://home.comcast.net/~jscheuer1/side/vfs/vac_plain.htm

John Davenport Scheuer -- LOVE your script. If one can figure it out, may one use it?

jscheuer1
04-03-2009, 03:11 AM
So, I have played with the different parameters... and need help again.
It takes me time... ;)
Here is the prototype :
http://lionel122.free.fr
I would like to have the thumbs in a "C Motion Image Gallery". As you see it does not work... what is wrong in the code ??
Then, I will customize the buttons and try to add comments for each photo :rolleyes:

Looks like it's kind of working. When I have more time I'll see what I can do. In the mean time, try more than just 2 images. And I think maybe you've left out a background color somewhere, putting it back might make the images appear to fully cover each other.


http://home.comcast.net/~jscheuer1/side/vfs/vac_plain.htm

John Davenport Scheuer -- LOVE your script. If one can figure it out, may one use it?

Sure, as long as the credit stays intact. I was thinking of submitting this one to DD, but was having trouble explaining its use . . . It has many many options, and optional ways of doing things.

See also:

http://www.dynamicdrive.com/forums/showthread.php?p=174374#post174374

and:

http://www.dynamicdrive.com/forums/showthread.php?p=180497#post180497

and:

http://www.dynamicdrive.com/forums/showthread.php?t=40801

and:

http://www.dynamicdrive.com/forums/showthread.php?t=41519

lio
04-06-2009, 04:39 PM
John, I did not find how to solve the problem of the images covering each other :( and finally I have tried with the original script
http://home.comcast.net/~jscheuer1/side/vfs/vac_plain.htm
and put one image with another dimension : the problem is the same :p

If you have time, can you tell me how the buttons can be changes by images like in the Swiss Army Slideshow ? Not so easy for me than I expected... :rolleyes:

Thanks ;)

lio
04-07-2009, 10:36 AM
I have found, thanks to one of your links :D
On this link it works
http://home.comcast.net/~jscheuer1/side/vfs/vac_import.htm
thanks to
#vac table {
background-color: #......;
}
You were right, it was a question of a background color :p