Reply
need a script to display/toggle overflow visibility
Old 07-10-2006, 09:21 AM need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
Hi,

i have a photography forum and i want to use the overflow code to control the visibility of posted images.

I want to then show the full image in place when the partial image is clicked. I think i need to use onclick command.

I can do the overflow bit..

my test example

http://www.digitalimaging-uk.co.uk/misc/

what i want to do is be able to click the image and it show fullsize (overflow:visible). I believe i need some javascript to do this but don't know how.

can anyone please help.

I wish it to toggle between visible and auto on mouseclick starting in the auto state.

thanks in advance..

dave
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
When You Register, These Ads Go Away!
Old 07-10-2006, 10:00 AM Re: need a script to display/toggle overflow visibility
funkdaddu's Avatar
Web Design Snob

Posts: 636
You could do something like this:
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
.box {
	border: solid 1px #aaa;
	width: 300px;
	height: 300px;
	overflow: hidden
	}

.fullbox {
	border: solid 1px #aaa;
	overflow: auto
	}

--></style>
		<script type="text/javascript"><!--
function toggleOverflow(obj) {
	obj.className = (obj.className != "fullbox") ? "fullbox" : "box";
}
//-->
</script>
	</head>

	<body bgcolor="#ffffff">
		<div class="box" onclick="toggleOverflow(this);"><img src="http://www.digitalimaging-uk.co.uk/filestore/files/1/Forum_Images/yellow_selective.jpg"></div>
	</body>

</html>

Last edited by funkdaddu : 07-10-2006 at 10:02 AM.
funkdaddu is offline
Reply With Quote
View Public Profile Visit funkdaddu's homepage!
 
Old 07-10-2006, 11:08 AM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
thanks a lot,

on first pass that looks very promising

i'll feedback once i have had a chance to try it in situ..

cheers
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Old 07-10-2006, 03:41 PM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
hi, me again,

i've implemented this in a test forum (copy of my live one)

in firefox it looks and works great exactly how i want it.

images show with small horiz scroll then enlarge and where the res of the user monitor is still not enough the larger image has a scroll bar. Excellent.

however in ie it is a mes..

both horiz and vertical scroll and when fully opened the whole page has a scroll and not just the image..

here is a link to a test page please have a look using both ff and ie and is there anything i can do to get ie to work the same as ff.

http://www.digitalimaging-uk.co.uk/T...7346efd3802129

thanks.
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Old 07-10-2006, 03:55 PM Re: need a script to display/toggle overflow visibility
funkdaddu's Avatar
Web Design Snob

Posts: 636
Hmmm... I'm not seeing exactly what you are. But I think your .box class needs overflow: hidden, not auto. Otherwise IE will add the scrollbars. And I think IE can only have both scrollbars or none, not one or the other.

Last edited by funkdaddu : 07-10-2006 at 03:59 PM.
funkdaddu is offline
Reply With Quote
View Public Profile Visit funkdaddu's homepage!
 
Old 07-10-2006, 04:04 PM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
ok thanks on the scroll bars..guess ie users will have to live with that.

if your resolution is larger than 1280 horiz then you'll probably not see the horizontal scroll bars under the 'full' image.

Maybe you could set your res lower to see what i mean ? if that's not too much trouble..

thanks
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Old 07-10-2006, 05:30 PM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
hiya,

i have managed to remove the vertical scroller in ie

replaced overflow: auto;

with

overflow-x: auto; overflow-y: hidden;

now if i could only find a way round the other problem
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Old 07-11-2006, 07:28 AM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
the overflow doesn't work in opera 9.

when the page open the image is at full size and when clicked goes to the width of the table but not to the specified width (currently 900px)

any thoughts on this ?
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Old 07-22-2006, 10:26 AM Re: need a script to display/toggle overflow visibility
davlam's Avatar
Experienced Talker

Posts: 47
hiya,

i've got a new problem i hope a fresh set of eyes can help with.

I got this mod working in my live forum.

I am now upgrading the forum and have tried to implement it in this.

I have added exactly the same code into the 3 files i need to edit. But it doesn't expand the hidden area.

this is how it should work http://www.digitalimaging-uk.co.uk/p...opic.php?t=679

and this is it in the new forum
http://www.digitalimaging-uk.co.uk/o...opic.php?t=679

can anyone suggest what i have done wrong.

cheers
__________________
digitalimaging-uk photography services, galleries, blog and forums.
davlam is offline
Reply With Quote
View Public Profile
 
Reply     « Reply to need a script to display/toggle overflow visibility
 

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off




   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 


Page generated in 0.16727 seconds with 12 queries