Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

gridview freeze header unfreezing on img class change

Status
Not open for further replies.

tekkerguy

Programmer
Nov 16, 2005
196
US
I have a gridview where I'm freezing the header row using
this.offsetParent.scrollTop-1. which is working.

However, in the gridview tablerows, I have an img tag, with a class, where the background image is an i. the img tag has a mouseover/mouseout events set to change the class, which in turn changes the i image.

Whenever the mouseover/mouseout is fired, it changes the image, however the header is unfrozen and appears where it would have been, had it not been frozen, and is then refrozen at that spot.

Any ideas as to why this is happening and how to stop it?
 
Maybe a look at the code that is causing the problem would help. Without seeing the code, I would say that the problem may be down to the use of tables (known for all kinds of problems when mixed with some css rules).

Cheers,
Jeff

[tt]Jeff's Blog [!]@[/!] CodeRambler
[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094
 
I'll post what I can in a moment, but it also seems that if I scroll the main window scrollbar, not the div scroll, the headers move with that as well (or rather stay still while the whole screen scrolls)
 
here's the table


Code:
   <div id="containingDivid" class="contdivclass" style="height: 200px; overflow-x: hidden; overflow-y: auto">
        <div id="Panelid" style="height:217px;">
	
            <div>
		<table class="ContentTable" cellspacing="0" cellpadding="0" rules="all" border="0" id="gridviewid" style="border-width:0px;width:100%;border-collapse:collapse;">
			<thead>
				<tr class="ColumnHeader">
					<th align="left" scope="col" style="width:15%;">headerCell</th>
          <th class="class" align="left" scope="col">headerCell</th>
          <th scope="col">&nbsp;</th>
          <th align="left" scope="col">headerCell</th>
          <th class="class" scope="col" style="width:20%;">headerCell</th>
          <th class="class" scope="col" style="width:18%;">headerCell</th>
				</tr>
			</thead><tbody>
				<tr class="Even">
					<td align="left">bodyCell</td>
          <td class="MoreInfo" align="left">bodyCell</td>
          <td><img src="img/blnk.gif" id="imgid" class="InformationOut" onmouseover="this.className='InformationOver'" onmouseout="if(tooltip.target!=this)this.className='InformationOut'" alt="Quick Preview" onclick="tooltip.show(this,null,650,285,340,250,'pagename','title');" /></td>
          <td align="left"></td>
          <td class="Right"></td>
          <td class="Right MoreInfo"></td>
				</tr><tr class="Odd">
				</tbody>
		</table>
		</div>
		</div>
    </div>


and this is the style in the header


Code:
		   <style type="text/css">
	.ContentTable thead tr
	{
    position:relative;
    top:expression(this.parentElement.parentElement.parentElement.scrollTop-2);
    }
    <style>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top