473,847 Members | 1,420 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

select element flicker hell

This seems an IE issue only:
4253 bytes testcase:

http://www.hot.ee/idaliiga/testcases...lectinmsie.htm

Can one have
1) a mouseover/mouseout element on TBODY
2) change in thoise event handler background colors
3) have a specified heighted SELECT element, that doesnt flicker
when the event handlers are get called.

all together.
I noticed that when I took the fisrt table out from the outermost table,
then the flicker dissapeared. However the design tables enforce such
design, so cant take them out,

Does anybody have summarized this bug in short rules in english/german
so I could be aware of what should I avoid...
TIA
Jul 23 '05 #1
4 3872
VK
Your showcase is brocken: moving the mouse highlights the entire table
instead of separate rows.
Make it work first as intended (whatever "blinking" it takes).

Another hint: instead of using the proper TOM methods, you are using
getByTagName('t body').
There are three of these on your page. Which one do you want and which one
are you really getting?

Welcome back when ready!
Jul 23 '05 #2
VK wrote:
Your showcase is brocken: moving the mouse highlights the entire table
instead of separate rows.
Make it work first as intended (whatever "blinking" it takes).
it highlights the TBODY, not the table as you think
Besides where did you get the idea about showcase beeing broken?
It aint. You are just making assumptions on your own what it should do.
In my original post no word was mentioned about ROWHIGHLIGHTS.
Not a single word.

If you like it in the fashion of rowhighlights, then you can modify that
it does so. It doesnt affect he flickering by making it better. Probably
it makes flickering even worse.

Another hint: instead of using the proper TOM methods, you are using
getByTagName('t body').
No I am not using getByTagName('t body'). I use
getElementsByTa gName('tbody') which is perfectly legal.
There are three of these on your page.
What of three? Addressing
var srchrestble = document.getEle mentById('repor tresults');
var tds = srchrestble.get ElementsByTagNa me('tbody');
makes it clear that there are one.

Which one do you want and which one are you really getting?
Welcome back when ready!


I think it is ready from start up for beeing a showcase.
You are just adding your own requerments what the script should do
weheras those requirements you make, make the script totally different
in functionality.

The only concern is flicker.
WHich dissapears when the height on the selects is removed
or the inner table with selects is taken out from the outer container
table.
Jul 23 '05 #3
VK
1.
In my original post no word was mentioned about ROWHIGHLIGHTS.
Sorry, I was wrong. I got this idea from your code. As any table has only
one tbody element, there is no use to iterate through it (tds.lenght is
always eq 1). So I wrongfully assumed that you tried to
reach some underlying objects, which would be rows in this case.

2. Does anybody have summarized this bug in short rules in english/german
so I could be aware of what should I avoid...


You have disturbed the graphics context on the page by a set of
mutually-excepting draw instructions.

..searchagent-2-criterion {
FONT: 24px Tahoma; WIDTH: 100%; HEIGHT: 100px
}
and
<SELECT class=searchage nt-2-criterion
id=searchagent_ 2_criterion_2 size=7 name=foo0>

Let's translate it in English: "Draw me a select box of 100px height and
place in it seven lines of text, where each line is approx. 20px high. All
seven lines must be fully visible and retain nice vertical gaps of 4px
between of them and the box borders. The box cannot exceed the given 100px
height. Go!"

You don't need to be a great mathematician to see that it is something wrong
with this picture. Is it going to be silently ignored or ignored with a
flicker, what part will be ignored on what browser - these are irrelevant
questions.

So you should avoid mutually-excepting draw instructions, because it leaves
you on the merci of a particular browser.

Jul 23 '05 #4
VK wrote:
You have disturbed the graphics context on the page by a set of
mutually-excepting draw instructions.
..searchagent-2-criterion {
FONT: 24px Tahoma; WIDTH: 100%; HEIGHT: 100px
}
and
<SELECT class=searchage nt-2-criterion
id=searchagent_ 2_criterion_2 size=7 name=foo0>
Thats true, I have done so.

But text input fields are on many other sites also done in this manner
<input type="text" size="20" style="width:30 0px;">

Why I need that size attribute on SELECT is that I need the element to
be SELECT LIST and not SELECT DROPDOWN.
Let's translate it in English: "Draw me a select box of 100px height and
place in it seven lines of text, where each line is approx. 20px high. All
seven lines must be fully visible and retain nice vertical gaps of 4px
between of them and the box borders. The box cannot exceed the given 100px
height. Go!"
You don't need to be a great mathematician to see that it is something wrong
with this picture. Is it going to be silently ignored or ignored with a
flicker, what part will be ignored on what browser - these are irrelevant
questions.
CSS should in theory overdefine the original height (as without css
applied) and element should generate scrollbars if needed. Aparently
MSIE6 (and I dont know about older, possibly so too) has huge problems
getting it right (e.c. no problems in mozilla)

The TBODYHIGHLIGHT has *no impact* whatsoever opn the height of the
table, therefore this phenomenon is a bug. If you use event handlers on
TDs or TRs the flcikering doesnt appear. Plus taking in acount that the
flickering occurs in totally different table. Plus teh fact that MSIE6
can peacefully draew the selects with CSS given height.
It just the event handlers that chane background color on totally
different tables tbody make it flicker, which is very odd.
So you should avoid mutually-excepting draw instructions, because it leaves
you on the merci of a particular browser.


Yes I have noticed it that when I remove the height it dissapears.
But the mystique thing to me was it appears on some pleaces and on rare
layouts it doesnt appear. But since I have lil time, I dont have the
full days time to investigate and summarize it up completely I will go
with the no height applied direction, because of remake of the html
templates is too late for now.
For historical reasons I shall put here the copy of that problemous
file, so have oppurtunety to refer back one day.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="et" lang="et">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Blinki ng Selectyed in MSIE</title>
<style type="text/css">

..searchagent-2{
width:100%;
}
.searchagent-2-criterion{
width:100%;
height:400px;
font:24px Tahoma;
}

..reportresults {
width:100%;
table-layout:fixed; /* without this IE wont make the table as wide as
possible, but shrinkwraps (While mozilla doesnt need this hee for this) */

}

</style>
<script type="text/javascript">//<![CDATA[

window.onload = function(){
var srchrestble = document.getEle mentById('repor tresults');

// check only for MSIE
if (srchrestble && document.all&&w indow.offscreen Buffering){
var tds = srchrestble.get ElementsByTagNa me('tbody');
var i=0;
for (i=0; i<tds.length;i+ +){
tds[i].onmouseover = function(){
this.style.back groundColor = 'infobackground ';
}
tds[i].onmouseout = function(){
this.style.back groundColor = '';
}
}
}
}
//]]></script>
</head>
<body>
<table height="200" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<form action="savedre portslist.php" method="post">
<table cellpadding="0" cellspacing="0" border="0"
class="searchag ent-2">
<tbody>
<tr>
<td valign="top" width="33%">
<select name="foo0" id="searchagent _2_criterion_0" size="7"
class="searchag ent-2-criterion">
<option>These </option>
<option>items </option>
<option>flick er very much</option>
</select>
</td>
<td valign="top" width="33%">
<select name="foo1" id="searchagent _2_criterion_1" size="7"
class="searchag ent-2-criterion">
<option>When I move the mouse</option>
<option>Over the table rows here below</option>
<option>in MSIE6</option>
<option>this looks oughful</option>
<option>These </option>
<option>items </option>
<option>flick er very much</option>
<option>These </option>
<option>items </option>
<option>flick er very much</option>
</select>
</td>
<td valign="top" width="33%">
<select name="foo2" id="searchagent _2_criterion_2" size="7"
class="searchag ent-2-criterion">
<option>Over the table rows here below</option>
<option>in MSIE6</option>
<option>this looks oughful</option>
<option>These </option>
<option>items </option>
<option>flick er very much</option>
<option>These </option>
<option>items </option>
<option>flick er very much</option>
</select>
</td>
</tr>
</tbody>

</table>
</form>
<table cellpadding="0" cellspacing="0" border="1"
class="reportre sults" id="reportresul ts">
<tbody>
<tr class="odd">
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;</td>
</tr>
<tr class="even">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
</tr>
<tr class="odd">
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
</tr>
<tr class="even">
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
</tr>
<tr class="odd">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr class="even">
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;a</td>
<td>&nbsp;a</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</tbody>

</table>

</td>
</tr>
</table>
<div>HOW do I get rid of the SELECT blinking in MSIE in case the mouse
is moved over the table #reportresults rows (BY KEEPING THE EVENT
HANDLER ON THE TBODY element)? The SELECT BOXES SHOULD HAVE SPECIFIED
HEIGHT IN PIXELS.</div>

</body></html>
Jul 23 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
5026
by: Michael | last post by:
Here is my problem: I have a MDI application and when I load my child forms I get alot of flicker. I have tried to implement double buffering : Public Sub New() MyBase.New() 'This call is required by the Windows Form Designer.
0
1911
by: mp3boss | last post by:
I am updating a string in the format MM:SS every second using the On_Timer event in Access97 by changing the caption of a label. Even though I'm using 8point text, the box sometimes flickers (transparent background changes to light-gray before reverting back to transparent). The text is drawn on top of a rectangle that is on top of a form that may have an embedded picture. If I create a very-simple form without all of these elements, I...
3
3535
by: Per Dunberg | last post by:
Hi all, I have to develop a "skinned" application and I have a problem with the graphics. When a form is loaded and displayed there's aways a flicker where all the controls are located on the form. It seems like the controls erase the background and this cause a flicker everytime a form i loaded. When I hide and show forms that are already loaded there's no flicker, it's just when the form is loaded the first time.
3
5682
by: seamlyne | last post by:
The first method I ever used for multiple state buttons was to create a graphic for each button for each state: AboutUs_on, AbooutUs_over, AboutUs_out, etc. That works great when there are just a few buttons. I'm creating interfaces now with many more buttons than "just a few". I solved the maintenance problem by having generic button images, one for each state, and having them be background images for text containers, DIVs in this...
17
4769
by: pigeonrandle | last post by:
Hi, I have seen loads of different ways to do this, but the all seem to yield the same result - text that doesn't flicker when it's moving too slowly! Does anyone know 'the best way' to make text scroll... eg Override OnPain and OnPaintBackground Override WndProc
1
3672
by: Wayne | last post by:
I've noticed some screen flicker when using Access 2003 under Vista and I'm curious as to whether this is a bug or peculiar to my machine. In design view, if I make changes to a form and then close the form, a couple of seconds after I have OKed the save prompt the Database Window that shows all my objects gives one flicker. Once again, in design view if I change a property for a control in the Properties box and then move the mouse...
4
10763
by: Frank Rizzo | last post by:
Hello, I inherited a large Winforms project that is suffering from excessive flicker when switching between portions of the application. I've noticed that most parts of the application (user controls and forms) have DoubleBuffered set to true. In addition to that, in the constructor of every form and user control, there is this line: SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.OptimizedDoubleBuffer, true);
0
1142
by: Rainer Queck | last post by:
Hello NG, I had/have a bad flicker Problem with my Application. On starting some applications, while my app was running, the whole Display started to flicker. Even the desktop Icons! Looking for help on this issue, I ran over a anser Linda Liu at : http://groups.google.de/group/microsoft.public.dotnet.languages.csharp/browse_thread/thread/39e9f7d0b96b048f?hl=de where I found the following (quick and dirty )solution to the flicker
0
9892
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
10991
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10653
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
10347
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
1
7888
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
7061
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5725
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
4540
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
3168
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.