Hovering effect for entire row

4 posts, 0 answers
  1. Navaneeth Kumar
    Navaneeth Kumar avatar
    9 posts
    Member since:
    Feb 2010

    Posted 29 May 2013 Link to this post

    Hi,

    In Timeline view, is it possible to override the default behavior of highlighting a specific time slot when hovering over it?

    I would want the entire row to be highlighted instead of the particular timeslot?

    Thanks in advance.
    Navaneeth
  2.
  3. Plamen
    Admin
    Plamen avatar
    3079 posts

    Posted 30 May 2013 Link to this post

    Hi Navaneeth,

     
    You can achieve similar scenario by setting a custom new style for hovering as for example in the code below:

    <style type="text/css">
     
           .rsAllDayRow:hover, .rsAptCreate {
           background-color:red !important;
           background-image:none !important;
           }
       </style>

    Hope this will be helpful.

    Regards,
    Plamen
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Navaneeth Kumar
    Navaneeth Kumar avatar
    9 posts
    Member since:
    Feb 2010

    Posted 30 May 2013 Link to this post

    Hi Plamen,

    Thanks for the quick response. However when the user hovers over the row in scheduler, there is a row in a radgrid that needs to have the same hover effect too. So I am looking at any client events in the scheduler by which the hovering effect can be applied.

    Your help would be appreciated.

    Thanks,
    Navaneeth
  7. Plamen
    Admin
    Plamen avatar
    3079 posts

    Posted 03 Jun 2013 Link to this post

    Hi Navaneeth,

     
    You can achieve similar functionality with jQuery as in the code below:

    function pageLoad() {
                  var $ = $telerik.$;
                  $(".rsAllDayRow").on("mouseenter", function myfunction() {
                      $(this).children().css("background-color", "red");
                      $(this).children().css("background-image", "none");
                  })
                  $(".rsAllDayRow").on("mouseleave", function myfunction() {
                      $(this).children().css("background-color", "inherit");
                      $(this).children().css("background-image", "inherit");
                  })
              }

    Hope this will be helpful.

    Regards,
    Plamen
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top