PDA

View Full Version : Conveyor Belt Slideshow Help



macko121
12-29-2004, 11:46 AM
Convery belt Slideshow
http://www.dynamicdrive.com/dynamicindex14/leftrightslide.htm

This is a great script but i want to create a popup window for the images in the slide show i've created my popup function and i call it from the <a href> link found in the slide show and a pop up is created when i don't specify a url. However; when i do specify a URL i get and error " Expected(;)"

the line of code that i'm using to call the popup is <a href="javascript:popup('sprotster.htm')"> so is there a way i can make it work please advise

much appreciated

MrMatt
01-04-2005, 01:10 AM
Hi

I've spent the past few days trying to figure this out but have had no joy and would really appreciate any ideas on this. I get the same expected (;) error. I tried adding the ; (after the javascript: ) but the slideshow fails to appear. My coding is as follows:

<head>
<SCRIPT type=text/javascript>
<!-- Begin
function Start(page) {
OpenWin = this.open(page, "CtrlWindow", "toolbar=no,menubar=no,status=yes,location=no,scrollbars=no,resizable=no,width=525,height=525");
}
// End -->
</SCRIPT>
</head>

To try and call the popup function from the slideshow:

leftrightslide[0]='<a href="javascript:Start('images/x_01_large.jpg')"><img src="images/x_01.jpg" border=1></a>'

Any help very much appreciated.

Thanks

Matt

mwinter
01-04-2005, 01:51 AM
<SCRIPT type=text/javascript>That attribute value must be quoted.


<!-- Begin"Hiding" the contents of script and style elements has been unnecessary since the introduction of Netscape 2. That should be at least six years ago. Stop doing that.


"toolbar=no,menubar=no,status=yes,location=no,scrollbars=no,resizable=no,width=525,height=525"Setting the size of a window yet removing the scroll bars and preventing it from being resized is, quite frankly, dumb no matter what is being placed within the window. If the user doesn't need to resize the window, providing that ability does no harm. Similarly, if the scroll bars aren't needed, there's no problem. However, if for some reason either of those features are necessary, you've just made that window very difficult to use.

By the way, a shorter (corrected) version of that feature string is

'status,resizable,scrollbars,width=525,height=525'


leftrightslide[0]='<a href="javascript:Start('images/x_01_large.jpg')"><img src="images/x_01.jpg" border=1></a>'The javascript: pseudo-protocol was intended to be used when the content of a document was to be replaced based on the interpretation of some Javascript code. Be that as it may, the pseudo-protocol should not be used on the Web as it provides users with no scripting support no fallback.

The link above should be written:

<a href="images/x_01_large.jpg" target="ctrlWindow"
onclick="OpenWin=openWindow(this, 525, 525);return false;"
><img alt="Provide your own alternative text, even if it's an empty string"
src="images/x_01.jpg"
></a>
with openWindow defined as

function openWindow(link, width, height) {
return window.open(
link.href,
link.target,
'status,scrollbars,resizable,width=' + width + ',height=' + height
);
}

Make openWindow more (or less) generic as you see fit. If you want to control the border around the img element, use CSS. At a basic level, you'd achieve the same effect with

a img {
border: 1px solid;
}
The border should inherit the colour of the link. However, as that would apply to all images within links, you may need to be more specific with your selector.

Mike

MrMatt
01-04-2005, 03:03 AM
Hi

Thanks for the prompt reply.

1. My fault - typo - forgot the quotes in the post.

2. Have removed the <!-- Begin - thanks - I have only started learning Javascript in the past month but I've seen it referenced this way on several script web sites.

3. Makes sense. My reason for removing scrollbars was that the x_01_large.jpg is 500x500 so I just set the window size to slightly larger.

4. I've made the changes as suggested but unfortunately I am still getting an error (expected ;). The conveyor belt slideshow fails to start.

Is the problem because I am calling the openwindow function from within another javascript?

Thanks

Matt

mwinter
01-04-2005, 12:40 PM
Thanks for the prompt reply.You're welcome.


Have removed the <!-- Begin [...] but I've seen it referenced this way on several script web sites.Unfortunately, much of the material on the Web (and in books) is out-of-date.


I've made the changes as suggested but unfortunately I am still getting an error (expected ;).Are you escaping the inner set of quotation marks? For example,

'some "quoted" text'is fine because the innermost quotes are different from the outer set. However,

'this isn't OK'the apostrophe here is a syntax error. It would need to be written

'this isn\'t OK'
Hope that helps,
Mike

MrMatt
01-04-2005, 02:07 PM
Hi

You found the problem - the img alt tag had a word with an apostrophe in it which was causing the error. Have removed this and now it works.

Many, many thanks.

Matt

something4u
01-06-2005, 02:31 PM
That attribute value must be quoted.

with openWindow defined as

Code:
function openWindow(link, width, height) {
return window.open(
link.href,
link.target,
'status,scrollbars,resizable,width=' + width + ',height=' + height
);
}



Make openWindow more (or less) generic as you see fit. If you want to control the border around the img element, use CSS. At a basic level, you'd achieve the same effect with

a img {
border: 1px solid;
}
The border should inherit the colour of the link. However, as that would apply to all images within links, you may need to be more specific with your selector.

Mike

hi hi i have the same problem but iīm very newbie and so it would be nice if you could explain this part (where and how i had to put in the script)

thx

Stefan

mwinter
01-06-2005, 03:41 PM
it would be nice if you could explain this partWhich part would that be? :p To try to answer all possibilities:


<head>
<!-- Any head-content elements, including TITLE -->

<style type="text/css" media="screen">
/* Alternatively, you could place the rule below in an external file.
* The HTML Specification (http://www.w3.org/TR/html4/) provides
* details on how do this in section 14.3 - External style sheets
* (http://www.w3.org/TR/html4/present/styles.html#h-14.3).
*/
a img {
border: 1px solid;
}
</style>

<script type="text/javascript">
function openWindow(link, width, height) {
return window.open(
link.href,
link.target,
'status,scrollbars,resizable,width=' + width + ',height=' + height
);
}
</script>
</head>

<body>
<!-- Document content -->

<p><a href="http://www.example.com/" target="example"
onclick="openWindow(this, 533, 400);return false;"><img
src="example.jpg" alt="Lorem ipsum dolor sit amet..."></a></p>

<!-- More document content -->

Hope that helps,
Mike


[edit: wasn't quite finished :rolleyes:]

something4u
01-09-2005, 01:20 AM
wow thx a lot.... :)

is it possible to get a black background in the popup? and it would be cool if click on the popup would close it

my site --> www.something4u.de

mwinter
01-09-2005, 01:01 PM
is it possible to get a black background in the popup?If you're just showing an image, no.


it would be cool if click on the popup would close itThink about that for a moment. What if the user clicks on the pop-up for some other reason? For example, to re-focus it after using another window/application. A user would not be happy for that window to disappear. Users know how to close a window using their browser. Let them do it.

On a similar note, it's a pet peeve of mine when authors think it's "cool" to close a window when the blur event is fired. There are so many reasons why a window may lose focus, completely unrelated to my use of their site. Just because they might single-task when browsing doesn't mean others do.

Mike

something4u
01-09-2005, 05:15 PM
thx for posting :-)

and if i canīt get an black background is it possible to have no white edge to the top an to the left?

sorry for the (sure, for a professional) stupid questions

because my english is so terrible that i try to explain it in a picture :D
i want to delete the red market areas
http://www.something4u.de/neu.jpg

in the end it should be look like this picture

http://www.something4u.de/neu2.jpg

mwinter
01-09-2005, 09:48 PM
if i canīt get an black background is it possible to have no white edge to the top an to the left?I'm afraid not. You'll just have to live with that.


sorry for the (sure, for a professional) stupid questionsNo question is stupid as long as you learn something from the answer. Well OK, some questions are stupid but these haven't been. :p


because my english is so terrible that i try to explain it in a pictureThe screenshots were appreciated, but not because of your English - I didn't know what "white edge" you were referring to (I don't use IE).

Mike

Minos
01-10-2005, 04:37 AM
Actually, if I'm not mistaken, placing this in the <head> tags will get rid of that space:



<style type="text/css">
body{margin: 0px}
</script>

mwinter
01-10-2005, 08:07 PM
Actually, if I'm not mistakenIn this instance, you are. We're discussing images, not mark-up.

In a HTML document, a user agent may add margins or padding as it sees fit, but as I said, this particular issue doesn't involve HTML (look at the URLs displayed in the screenshots).



<style type="text/css">
body{margin: 0px}
</script>If you want to remove spacing (to be generic) from the body element, the more appropriate rule to use is


body {
margin: 0;
padding: 0;
}Notice that units are not needed when a length value is zero (0).

Not all user agents specify a margin. Some use padding instead. Some may even use both.

Mike

Minos
01-11-2005, 04:59 AM
Damn, you're right, I didn't pay enough attention! And I was so proud not to have been corrected by you! /cry!