lindm Posted June 13, 2009 Share Posted June 13, 2009 Having trouble creating a tooltip contents. It is supposed to match a class with a variable of the script. For instance, if an element has the class "tip1" the contents of variable tip1 will be shown, etc. Se my script so far, based on Vertigo script and jquery, rebuilt to be able create tooltip contents from variable. The critical code is "+ this.className +" in the javascript: Javascript: /** Based on Vertigo Tip by www.vertigo-project.com Requires jQuery */ var tip1 = "tip1"; var tip2 = "tip2"; var tip3 = "tip3"; var tip4 = "tip4"; var tip5 = "tip5"; this.vtip = function() { this.xOffset = -10; // x distance from mouse this.yOffset = 10; // y distance from mouse $("*[class^=tip]").unbind().hover( function(e) { this.top = (e.pageY + yOffset); this.left = (e.pageX + xOffset); $('body').append( '<p id="vtip"><img id="vtipArrow" />' + this.className + '</p>' ); $('p#vtip #vtipArrow').attr("src", 'images/vtip_arrow.png'); $('p#vtip').css("top", this.top+"px").css("left", this.left+"px").show(); }, function() { this.title = this.t; $("p#vtip").hide().remove(); } ).mousemove( function(e) { this.top = (e.pageY + yOffset); this.left = (e.pageX + xOffset); $("p#vtip").css("top", this.top+"px").css("left", this.left+"px"); } ); }; jQuery(document).ready(function($){vtip();}) Html: <html> <head> <title>vTip Example</title> <script type="text/javascript" src="./jquery.js"></script> <script type="text/javascript" src="./vtip.js"></script> <link rel="stylesheet" type="text/css" href="css/vtip.css" /> </head> <body> <a href="" class="tip1">Example 1</a> </br> <a href="" class="tip2">Example 2</a> </br> <a href="" class="tip3">Example 3</a> </body> </html> Thanks Link to comment https://forums.phpfreaks.com/topic/162067-solved-match-variable-and-classname-in-tooltip-script/ Share on other sites More sharing options...
rhodesa Posted June 13, 2009 Share Posted June 13, 2009 replace this.className with window[this.className] Link to comment https://forums.phpfreaks.com/topic/162067-solved-match-variable-and-classname-in-tooltip-script/#findComment-855243 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.