Flickering of Rad time picker.

[Puneet PAthak]

Hi

Rad Time picker flickers as mouse hovers the header of the picker.
The date picker is working correctly.
Please find attached screen shots of the flickering images.

1. The screenshot_1 when mouse cursor is over the header of the time picker.

2. The screenshot_2 when mouse cursor is away from the header of the time picker.

3. When mouse is traversed over the header of time picker, the header starts flickering continuously with images of header in the screenshots.

4. I have used the following CSS for time picker.

 

<Quote>

.radTimeTableCss_Vista caption

{

    display: none;   

}

 

.radTimeTableCss_Vista

{

      cursor:default;

      background:#6A737B;

      font:normal 9pt verdana,"segoe ui", arial, verdana, sans-serif;

      color: #FFFFFF;

      border:solid 1px #979797;

      border-collapse:collapse;

}

 

.radTimeTableCss_Vista td

{    

      background:#FFFFFF;

      padding:0;

      margin:0;

}

 

.radHeaderCss_Vista

{

      text-align:center;

      border-bottom: solid 4px #78A22F ;

      padding:7px 0;

}

 

.radTimeTableCss_Vista a

{

      display: block;

    text-align: left;

    text-decoration: none;

      cursor: pointer;

}

 

.radAlternatingItemCss_Vista

{

      /*border-left:1px solid #e3e3e3;

      border-right:1px solid #e3e3e3;*/

}

 

.radItemCss_Vista a,

.radAlternatingItemCss_Vista a,

.radTimeOverCss_Vista a

{

      display:block;

      width:75px;

      height:20px;

      line-height:20px;

      margin-bottom:6px;

}

 

.radItemCss_Vista a,

.radAlternatingItemCss_Vista a

{

      color:#666;

}

 

.radTimeOverCss_Vista a

{    

      color: #6A737B;

      background: #eaf0e1 /*url(Img/radTimeOver.gif) no-repeat */;

}

 

.radTimeTableCss_Vista .radFooterCss_Vista

{

      color: #666;

}

 

 

.radPopupImage_Vista

{    

      position: relative; 

      *position: inherit;

      outline: none;

}

 

.radPopupImage_Vista img

{

      vertical-align: middle;

      _vertical-align: top; /* IE fix */ 

      margin-left: 8px; /*12 FEBspace between text field and calnedar */

      margin-right: 2px;

      margin-top: -1px; /* IE margins fix */

      _margin-top: 0px;

      border-width: 0px;

}

 

.radDisabled_Vista img

{

       filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);

      -moz-opacity: 0.6;

      opacity: 0.6;

}

</Quote>

How can I stop the flickering, without changing the css content of the header?

--Puneet

[Dimo]

Hi Puneet PAthak,

Please make the following changes to your CSS code. The issue is fixed in next versions.

.radHeaderCss_Vista ,
th.radItemCss_Vista,
th.radAlternatingItemCss_Vista
{
      text-align:center;
      border-bottom: solid 4px #78A22F ;
      padding:7px 0;
}

.....

.radItemCss_Vista a,
.radAlternatingItemCss_Vista a,
td.radTimeOverCss_Vista a
{
      display:block;
      width:75px;
      height:20px;
      line-height:20px;
      margin-bottom:6px;
}

.....

td.radTimeOverCss_Vista a
{    
      color: #6A737B;
      background: #eaf0e1 /*url(Img/radTimeOver.gif) no-repeat */;
}


Best wishes,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.