Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

<div style="overflow:auto">


  • Please log in to reply
2 replies to this topic

#1 Frantic

Frantic

    CC Resident

  • Just Joined
  • PipPipPipPip
  • 91 posts

Posted 21 September 2007 - 04:23 PM

Does this tag create a box with scroll-bars like an iframe in the middle of the webpage? Can someone post some code with this tag working correct?

<div style="overflow:auto">

If it does what I said above I'd like to use it but when I put that tag around my HTML it doesn't do anything or change the appearance in any way.
  • 0

#2 Guest_NeedHelp_*

Guest_NeedHelp_*
  • Guest

Posted 01 October 2007 - 06:18 PM

You might want to take a look here: http://forum.codecal...x-new-post.html
  • 0

#3 shafquatullah

shafquatullah

    CC Lurker

  • Just Joined
  • Pip
  • 1 posts

Posted 20 June 2008 - 03:28 AM

just save bellow code with html extention and see the result.

<html>
<body >
<head>
<script language="javascript">
//On scrolling of DIV tag.
function OnDivScroll()
{
	var lstCollegeNames = document.getElementById("lstCollegeNames");

	//The following archives two things while scrolling
	//a) On horizontal scrolling: To avoid vertical scroll bar in select box when the size of 
	// the selectbox is 8 and the count of items in selectbox is greater than 8.
	//b) On vertical scrolling: To view all the items in selectbox
	
	//Check if items in selectbox is greater than 8, if so then making the size of the selectbox to count of
	//items in selectbox,so that vertival scrollbar won't appear in selectbox
	if (lstCollegeNames.options.length > 8)
	{
		lstCollegeNames.size=lstCollegeNames.options.length;
	}
	else
	{
		lstCollegeNames.size=8;	
	}	
}

	//On focus of Selectbox
	function OnSelectFocus()
	{
		
		//On focus of Selectbox, making scroll position of DIV to very left i.e 0 if it is not. The reason behind
		//is, in this scenario we are fixing the size of Selectbox to 8 and if the size of items in Selecbox is greater than 8 
		//and to implement downarrow key and uparrow key functionality, the vertical scrollbar in selectbox will
		//be visible if the horizontal scrollbar of DIV is exremely right.
		if (document.getElementById("divCollegeNames").scrollLeft != 0)
		{
			document.getElementById("divCollegeNames").scrollLeft = 0;
		}


		var lstCollegeNames = document.getElementById('lstCollegeNames');
		//Checks if count of items in Selectbox is greater than 8, if yes then making the size of the selectbox to 8.
		//So that on pressing of downarrow key or uparrowkey, the selected item should also scroll up or down as expected.
		if( lstCollegeNames.options.length > 8)
		{
			lstCollegeNames.focus();
			lstCollegeNames.size=8;
		}
} 
</script>
</head>

<div id="divCollegeNames" style="OVERFLOW: auto;WIDTH: 304px;HEIGHT: 147px" onscroll="OnDivScroll();">
<SELECT id="lstCollegeNames" size="8" multiple onfocus="OnSelectFocus();">
<OPTION>St. Xavier's College, Ahmedabad</OPTION>
<OPTION>St. Joseph's College, Bangalore</OPTION>
<OPTION>St. Xavier's College, Mumbai</OPTION>
<OPTION>Sacred Heart College, Thevara, Ernakulam, Kerala</OPTION>
<OPTION>Research Foundation for Science, Technology and Natural Resource Policy, Bangalore</OPTION>
<OPTION>Jawaharlal Nehru University (JNU), New Delhi</OPTION>
<OPTION>ISRO Telemetry Tracking Command Network (ISTRAC),Bangalore</OPTION>
<OPTION>Defence Electronics Research Laboratory, Hyderabad</OPTION>
<OPTION>All-India Institute of Medical Sciences (AIIMS), Delhi</OPTION>
<OPTION>Indian Institue of Management, Ahmedabad</OPTION>
</SELECT>
</div>
</body>
</html>

Edited by WingedPanther, 20 June 2008 - 08:08 AM.
add code tags

  • 0




Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download