I'm trying to create a website where some of my friends can Download <!--more--> stuff for their mobile phone. One page is for wallpapers, and I've come up with two ways of doing more or less the same thing.<br />
<br />
Which of the designs do you think would most suitable?<br />
<br />
Layout 1 (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/random.htm">http://www.aparys.dsl.pipex.com/whap/random.htm</a><!-- m -->)<br />
Layout 2 (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/wallpaperiframe.htm">http://www.aparys.dsl.pipex.com/whap/wa ... iframe.htm</a><!-- m -->)<br />
<br />
The only real differences between the two are that one uses an iframe (layout 2) and the other uses a javascript mouseover thing.<br />
<br />
I prefer the way that the mouseover one displays the image without having to click on it, but I suspect the iframe will load faster as no images need to be preloaded until clicked on. Also, with the iframe, I am able to position where the image will be displayed far more accurately.<br />
<br />
Also any ideas about which of these would be compatible with most browsers?<br />
<br />
One last thing (for now!
) is that there's a problem with the iframe - when you click on the image, there appears to be a border around it which prevents it from being displayed correctly. Is there any way of preventing this from happening?<br />
<br />
(the main website is <!-- m --><a class="postlink" href="http://www.nokia6100.tk">http://www.nokia6100.tk</a><!-- m --> or here (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/">http://www.aparys.dsl.pipex.com/whap/</a><!-- m -->) if you want to see it in context. Also any feedback on design etc. would be appreciated!)<br />
<br />
Thanks,<br />
aleco<br />
<br />
PS oh dear! I've just uploaded the iframe version, and when I click on a link, it doesn't display in the iframe! <br />
It does when I use the file stored on my harddrive though! Any ideas why this is doing it?<!--content-->I would definetly go with layout 1, loading speed is negligable (although maybe someone with dialup might want to take a look at it)<br />
with the iframe, i coudlnt get in to see the code of the frame, but have you centered the image in the frame, using tables?<!--content-->Thanks for the reply!
<br />
<br />
There will be more images than that when I've finished, probably between 6-9 per page. Oh that also reminds me, I would ideally have liked to have another frame, so that the image of the phone and the wallpaper which is displayed on it is to the right in its own frame, so that on the left I could have more than 6-9 images displayed so that the user could scroll down the left hand frame. If i did this now without the frame, then the phone image would disappear as the user scrolled down, making it useless! Is there any way of doing this?<br />
<br />
The image displayed in the iframe is just a direct link to the image, no webpage is displayed (i couldn't be bothered to create a new webpage for each image!).<br />
<br />
Hmm, I think i'm sounding a bit confusing: I've got an iframe in the centre of the table, surrounded by the top, left, right, and bottom images of the phone. The image links on the left do not link to a page, they link directly to the image itself, which should display in the iframe, but doesn't for some reason, and also doesn't appear to be centered.<br />
<br />
Should I stick the images into their own webpage then to try and center them?<br />
<br />
I've put a quick diagram together to try and explain what i'm after:<br />
<br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/images/example.jpg">http://www.aparys.dsl.pipex.com/images/example.jpg</a><!-- m --><br />
<br />
The top and bottom frames are the ones from the main website this page will be loaded from<!--content-->yeah using frames would be one way to do it, also you could place the phone and iframe in 'scrolling' dhtml script, so it would always stay on the screen, when you scroll down the long list of images the phone would scroll down with you. I can't remember ofF hand which script it is exactly and am not 100% sure you can place an iframe in it, i'll go see if i can find one
<br />
<br />
for the images to open in the iframe you have to give the link a target to the name of the iframe, ie, target="iframename"<br />
<br />
<br />
/added<br />
<br />
here is a dhtml ilayer script, take a look (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com/dynamicindex11/scrollc.htm">http://www.dynamicdrive.com/dynamicindex11/scrollc.htm</a><!-- m -->) , might suit your needs<br />
<br />
/added2<br />
and another (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm">http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm</a><!-- m -->) you might like <br />
(both are compatible with ie4+ and nn4+)<!--content-->Thanks a lot! That seems to have done the trick! Only problem is that it doesn't appear to work in Opera, but tough! I'm not wasting any more time trying to find another way to do this!<br />
<br />
here's what it looks like:<br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/wallpaper.shtml">http://www.aparys.dsl.pipex.com/whap/wallpaper.shtml</a><!-- m --><br />
<br />
(NB It's not finished, that's why the images repeat, but shows it works!)<br />
<br />
Thanks again,<br />
<br />
aleco<!--content-->looks good!, it works in my opera (7.01)<!--content-->Oh! I'm using 7.10 and it looks like this:<br />
<br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/images/opera.jpg">http://www.aparys.dsl.pipex.com/images/opera.jpg</a><!-- m --><br />
<br />
But it's probably my computer! The iframe's weren't displaying correctly to begin with due to an advert blocker i had installed, so maybe its related!? I don't use Opera that much anyway. Infact, I may just not have configured it correctly.<br />
<br />
The page looks better with the top frames on, bit more in-keeping with the style (<!-- m --><a class="postlink" href="http://www.nokia6100.tk">http://www.nokia6100.tk</a><!-- m --> -> wallpaper -> random, if you want to look. Actually if you could see if the rest seems to work & give feedback I would be very grateful!)<br />
<br />
Thanks,<br />
aleco<!--content-->yeah the site look squite good and seems to work fine, i've attached a snapshot of what it looks like in my opera, i'm not very familiar with it to be able to say hat the problem is with it?<br />
Have you taken your site over to the validator?<br />
<!-- m --><a class="postlink" href="http://validator.w3.org/detailed.html">http://validator.w3.org/detailed.html</a><!-- m --><br />
<!--content-->
<br />
Which of the designs do you think would most suitable?<br />
<br />
Layout 1 (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/random.htm">http://www.aparys.dsl.pipex.com/whap/random.htm</a><!-- m -->)<br />
Layout 2 (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/wallpaperiframe.htm">http://www.aparys.dsl.pipex.com/whap/wa ... iframe.htm</a><!-- m -->)<br />
<br />
The only real differences between the two are that one uses an iframe (layout 2) and the other uses a javascript mouseover thing.<br />
<br />
I prefer the way that the mouseover one displays the image without having to click on it, but I suspect the iframe will load faster as no images need to be preloaded until clicked on. Also, with the iframe, I am able to position where the image will be displayed far more accurately.<br />
<br />
Also any ideas about which of these would be compatible with most browsers?<br />
<br />
One last thing (for now!
) is that there's a problem with the iframe - when you click on the image, there appears to be a border around it which prevents it from being displayed correctly. Is there any way of preventing this from happening?<br /><br />
(the main website is <!-- m --><a class="postlink" href="http://www.nokia6100.tk">http://www.nokia6100.tk</a><!-- m --> or here (<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/">http://www.aparys.dsl.pipex.com/whap/</a><!-- m -->) if you want to see it in context. Also any feedback on design etc. would be appreciated!)<br />
<br />
Thanks,<br />
aleco<br />
<br />
PS oh dear! I've just uploaded the iframe version, and when I click on a link, it doesn't display in the iframe! <br />
It does when I use the file stored on my harddrive though! Any ideas why this is doing it?<!--content-->I would definetly go with layout 1, loading speed is negligable (although maybe someone with dialup might want to take a look at it)<br />with the iframe, i coudlnt get in to see the code of the frame, but have you centered the image in the frame, using tables?<!--content-->Thanks for the reply!
<br /><br />
There will be more images than that when I've finished, probably between 6-9 per page. Oh that also reminds me, I would ideally have liked to have another frame, so that the image of the phone and the wallpaper which is displayed on it is to the right in its own frame, so that on the left I could have more than 6-9 images displayed so that the user could scroll down the left hand frame. If i did this now without the frame, then the phone image would disappear as the user scrolled down, making it useless! Is there any way of doing this?<br />
<br />
The image displayed in the iframe is just a direct link to the image, no webpage is displayed (i couldn't be bothered to create a new webpage for each image!).<br />
<br />
Hmm, I think i'm sounding a bit confusing: I've got an iframe in the centre of the table, surrounded by the top, left, right, and bottom images of the phone. The image links on the left do not link to a page, they link directly to the image itself, which should display in the iframe, but doesn't for some reason, and also doesn't appear to be centered.<br />
<br />
Should I stick the images into their own webpage then to try and center them?<br />
<br />
I've put a quick diagram together to try and explain what i'm after:<br />
<br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/images/example.jpg">http://www.aparys.dsl.pipex.com/images/example.jpg</a><!-- m --><br />
<br />
The top and bottom frames are the ones from the main website this page will be loaded from<!--content-->yeah using frames would be one way to do it, also you could place the phone and iframe in 'scrolling' dhtml script, so it would always stay on the screen, when you scroll down the long list of images the phone would scroll down with you. I can't remember ofF hand which script it is exactly and am not 100% sure you can place an iframe in it, i'll go see if i can find one
<br /><br />
for the images to open in the iframe you have to give the link a target to the name of the iframe, ie, target="iframename"<br />
<br />
<br />
/added<br />
<br />
here is a dhtml ilayer script, take a look (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com/dynamicindex11/scrollc.htm">http://www.dynamicdrive.com/dynamicindex11/scrollc.htm</a><!-- m -->) , might suit your needs<br />
<br />
/added2<br />
and another (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm">http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm</a><!-- m -->) you might like
<br />(both are compatible with ie4+ and nn4+)<!--content-->Thanks a lot!
That seems to have done the trick! Only problem is that it doesn't appear to work in Opera, but tough! I'm not wasting any more time trying to find another way to do this!<br /><br />
here's what it looks like:<br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/whap/wallpaper.shtml">http://www.aparys.dsl.pipex.com/whap/wallpaper.shtml</a><!-- m --><br />
<br />
(NB It's not finished, that's why the images repeat, but shows it works!)<br />
<br />
Thanks again,<br />
<br />
aleco<!--content-->looks good!, it works in my opera (7.01)
<!--content-->Oh! I'm using 7.10 and it looks like this:<br /><br />
<!-- m --><a class="postlink" href="http://www.aparys.dsl.pipex.com/images/opera.jpg">http://www.aparys.dsl.pipex.com/images/opera.jpg</a><!-- m --><br />
<br />
But it's probably my computer! The iframe's weren't displaying correctly to begin with due to an advert blocker i had installed, so maybe its related!? I don't use Opera that much anyway. Infact, I may just not have configured it correctly.<br />
<br />
The page looks better with the top frames on, bit more in-keeping with the style (<!-- m --><a class="postlink" href="http://www.nokia6100.tk">http://www.nokia6100.tk</a><!-- m --> -> wallpaper -> random, if you want to look. Actually if you could see if the rest seems to work & give feedback I would be very grateful!
)<br /><br />
Thanks,<br />
aleco<!--content-->yeah the site look squite good and seems to work fine, i've attached a snapshot of what it looks like in my opera, i'm not very familiar with it to be able to say hat the problem is with it?<br />
Have you taken your site over to the validator?<br />
<!-- m --><a class="postlink" href="http://validator.w3.org/detailed.html">http://validator.w3.org/detailed.html</a><!-- m --><br />
<!--content-->