Page 1 of 1

div width, height change depending on content loaded by Ajax

Posted: Wed Jun 13, 2007 3:06 am
by arukomp
Hello,

I've downloaded a free Ajax Tooltip script which loads content from external sites. But the tooltip has a fixed width and height. I want to change it so the Tooltip's width and height changes automatically depending on the content loaded by Ajax. I don't want to see any scroll bars because people won't be able to scroll them as if you move mouse out of the link, the tooltip disappears. Here's a CSS code which I think is handling Toolstip's height and width (I tried to change them and it worked):

Code: Select all

#ajax_tooltipObj{
	z-index:1000000;
	text-align:left;
}
#ajax_tooltipObj div{
	position:relative;
}

/* If you don't want the arrow - Just set the width of this div to 1 or something like that and drop the background selectors 

from the CSS below */

#ajax_tooltipObj .ajax_tooltip_arrow{	/* Left div for the small arrow */
	background-image:url('../images/arrow.gif');
	width:0px; /* 20 */
	position:absolute;
	left:0px;
	top:0px;
	background-repeat:no-repeat;
	background-position:center left;
	z-index:1000005;
	height:0px; /* 60 */
}

#ajax_tooltipObj .ajax_tooltip_content{
	border:1px solid grey;	/* Border width */
	left:18px;	/* Same as border thickness */
	top:0px;
	position:absolute;
	width:200px;	/* Width of tooltip content */
	height:100px;	/* Height of tooltip content */
	background-color:#FFF;	/* Background color */
	padding:5px;	/* Space between border and content */
	font-size:0.8em;	/* Font size of content */
	overflow:auto;	/* Hide overflow content */
	z-index:1000001;
}
Any help would be great! Thanks for any suggestions

Posted: Wed Jun 13, 2007 3:39 am
by matthijs
can't you set the height to auto?

Posted: Wed Jun 13, 2007 3:45 am
by arukomp
matthijs wrote:can't you set the height to auto?
Thanks :D It works now! :D

Posted: Wed Jun 13, 2007 3:55 am
by matthijs
Cool :)

Good luck with it

Posted: Wed Jun 13, 2007 5:55 am
by arukomp
matthijs wrote:Cool :)

Good luck with it
Thanks :)

Now my site will be much more interactive :D