Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Mar 2009
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts

    tooltip for wdCalendar

    Need help to convert the title that appears on the events area on mouseover to a nice looking tooltip. I tried to do this in BuildDayEvent function by adding p.class="masterTooltip" but it does not work.

    Code:
    function BuildDayEvent(theme, e, index) {
                var p = { bdcolor: theme[0], bgcolor2: theme[0], bgcolor1: theme[2], width: "70%", icon: "", title: "", data: "" };
    			
                p.starttime = pZero(e.st.hour) + ":" + pZero(e.st.minute);
                p.endtime = pZero(e.et.hour) + ":" + pZero(e.et.minute);
    						
                p.content = e.event[1];
                p.title = getTitle(e.event);			
    			//p.title = "onmouseover="showToolTip(event,'"+tooltip+"');return false" onmouseout="hideToolTip()"";
                p.data = e.event.join("$");
    			
                var icons = [];
                icons.push("<I class=\"cic cic-tmr\">&nbsp;</I>");
                if (e.reevent) {
                    icons.push("<I class=\"cic cic-spcl\">&nbsp;</I>");
                }
                p.icon = icons.join("");
                var sP = gP(e.st.hour, e.st.minute);
                var eP = gP(e.et.hour, e.et.minute);
                p.top = sP + "px";
                p.left = (e.left * 100) + "%";
                p.width = (e.aQ * 100) + "%";
                p.height = (eP - sP - 4);
                p.i = index;
                if (option.enableDrag && e.event[8] == 1) {
                    p.drag = "drag";
                    p.redisplay = "block";
                }
                else {
                    p.drag = "";
                    p.redisplay = "none";
                }
                var newtemp = Tp(__SCOLLEVENTTEMP, p);
                p = null;
                return newtemp;
            }
    
    
    <style>
    .tooltip {
    	display:none;
    	position:absolute;
    	border:1px solid #333;
    	background-color:#161616;
    	border-radius:5px;
    	padding:10px;
    	color:#fff;
    	font-size:12px Arial;	
    }
    
    </style>
    <script>
    	$jtooltip = jQuery.noConflict();
    	//$jtooltip("#gridcontainer a[title]").tooltip();
    	
    	
    	$jtooltip(document).ready(function() {
            // Tooltip only Text
            $jtooltip('.masterTooltip').hover(function(){
                    // Hover over code
                    var title = $jtooltip(this).attr('title');
                    $jtooltip(this).data('tipText', title).removeAttr('title');
                    $jtooltip('<p class="tooltip"></p>')
                    .text(title)
                    .appendTo('body')
                    .fadeIn('slow');
            }, function() {
                    // Hover out code
                    $jtooltip(this).attr('title', $jtooltip(this).data('tipText'));
                    $jtooltip('.tooltip').remove();
            }).mousemove(function(e) {
                    var mousex = e.pageX + 20; //Get X coordinates
                    var mousey = e.pageY + 10; //Get Y coordinates
                    $jtooltip('.tooltip')
                    .css({ top: mousey, left: mousex })
            });
    });
    	</script>
    Last edited by VIPStephan; 12-15-2012 at 07:41 AM. Reason: added code BB tags

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,680
    Thanks
    6
    Thanked 1,009 Times in 982 Posts
    If you post any code please put it in between [CODE][/CODE] tags. It makes scanning your posts much easier. You can do this by clicking the small ‘#’ icon above the reply field.

  • #3
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Code:
    p.className="masterTooltip"
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #4
    New Coder
    Join Date
    Mar 2009
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Tried it but no luck

  • #5
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Quote Originally Posted by dips255 View Post
    Tried it but no luck
    Should __SCOLLEVENTTEMP be __SCROLLEVENTTEMP..?

    What does your browser's console say?
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •