ToolTip Flickering on Mouseover

7 posts, 1 answers
  1. Aron
    Aron avatar
    24 posts
    Member since:
    Sep 2011

    Posted 19 May 2013 Link to this post

    On my home page (see link below), I dynamically build an HTML table of 9 tiles from a SQL database.  I've added a ToolTip widget to display additional information when the user mouses over the tile.

    The ToolTip widget is working, however, when I mouse over any of the top 3 tiles, the ToolTip flickers as the mouse moves over it. When I mouseover any of the middle 3 or bottom 3 tiles, the ToolTip works fine.

    The difference between the top 3 tiles and the others is that the the top 3 tiles have a very large “Title” text in the <a command.  Is there better way to do this so to avoid the flicker?

    http://life-renewal-test.org/    Thanks
  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 22 May 2013 Link to this post

    Hi Aron,

     

    I checked the provided link, however it's not clear for us what is the exact reason for this behavior - could you please provide runable project where the issue is reproduced? This would help us pinpoint the exact reason for this behavior.

    Kind Regards,
    Vladimir Iliev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Aron
    Aron avatar
    24 posts
    Member since:
    Sep 2011

    Posted 02 Jun 2013 Link to this post

    I created a Microsoft VS runable project which reproduces the problem.  However, I am getting an error saying the maximum size to upload is 2MB.  The zipped project size is 7.6 MB.  How can I ship it to you?
  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 05 Jun 2013 Link to this post

    Hi Aron,

     
    You can open a new support ticket where the maximum upload size is 20mb or upload the file to external FTP or cloud service and provide the link in current thread. 

    Kind Regards,
    Vladimir Iliev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Aron
    Aron avatar
    24 posts
    Member since:
    Sep 2011

    Posted 08 Jun 2013 Link to this post

    Support ticket submitted:  702435.  Page to view is default.cshtml
    Thanks
  7. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 11 Jun 2013 Link to this post

    Hi Aron,

     
    After reviewing the provided project it seems that the issue comes from that the tooltip cannot correctly calculate correctly it's position as the "a" element has no height defined. In current scenario I would suggest to move the title tag to the cell of the table:

    • HTML:
      <td class="galley" data-id="19.jpg" title="<u><b>Shoshana</b></u><br />Tell her story ......"><a href="#"><img src="/TTTest/news/imagesHomePage/19.jpg" />Shoshana</a></td>
    • Tooltip:  
      $("#products").kendoTooltip({
          filter: "td",
          content: kendo.template($("#template").html()),
          width: 400,
          position: "top",
          animation: {
              open: {
                  effects: "fadeIn"
              }
          }
      });      

    Kind Regards,
    Vladimir Iliev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  8. Answer
    Aron
    Aron avatar
    24 posts
    Member since:
    Sep 2011

    Posted 11 Jun 2013 Link to this post

    Perfect!  Thank you
Back to Top
Kendo UI is VS 2017 Ready