Css 在TinyMCE中的元素上使用jQueryUI工具提示
我想将jQueryUI的工具提示应用于TinyMCE编辑器中的元素，但是，它们不使用FF显示，并且使用IE和Chrome时有bug。我已经尝试将jQueryUI的工具提示应用于iframe中的元素，并得到了类似的结果。下面是我的脚本，演示位于（请注意，iframe JS必须被禁用，因为它使用jsbin会导致代理错误）。我认为工具提示正在创建中，但是，可能CSS是相对于iframe而不是文档的。我也尝试过创建自己的工具提示插件（），但也得到了一些有趣的结果 如何在TinyMCE编辑器中的元素上使用工具提示Css 在TinyMCE中的元素上使用jQueryUI工具提示,css,jquery-ui,iframe,tinymce,jquery-ui-tooltip,Css,Jquery Ui,Iframe,Tinymce,Jquery Ui Tooltip,我想将jQueryUI的工具提示应用于TinyMCE编辑器中的元素，但是，它们不使用FF显示，并且使用IE和Chrome时有bug。我已经尝试将jQueryUI的工具提示应用于iframe中的元素，并得到了类似的结果。下面是我的脚本，演示位于（请注意，iframe JS必须被禁用，因为它使用jsbin会导致代理错误）。我认为工具提示正在创建中，但是，可能CSS是相对于iframe而不是文档的。我也尝试过创建自己的工具提示插件（），但也得到了一些有趣的结果 如何在TinyMCE编辑器中的元素上使用
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>IFrame and tooltips</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.css" type="text/css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.js" type="text/javascript"></script>
<script src="http://tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({'selector': "#tinymce"});
$(document).ready(function(){
$('.tooltip').tooltip();
$('#click').click(function(){
console.log($('#iframeID').contents().find('.tooltip'));
$('#iframeID').contents().find('.tooltip').tooltip();
$('#tinymce').html('<div class="tooltip" title="Some Div4">Some DIV4</div><div class="tooltip" title="Some Div5">Some DIV5</div><div class="tooltip" title="Some Div6">Some DIV6</div>');
var t=tinymce.editors['tinymce'];
t.load();
console.log($(t.getBody()).find('div.tooltip'));
$(t.getBody()).find('div.tooltip').tooltip();
});
});
</script>
</head>
<body>
<button id='click'>Click</button>
<iframe src="iframe_page1.html" id="iframeID"></iframe>
<div class="tooltip" title="Some Div1">Some DIV1</div>
<div class="tooltip" title="Some Div2">Some DIV2</div>
<div class="tooltip" title="Some Div3">Some DIV3</div>
<div id="tinymce"></div>
</html>
IFrame和工具提示
init（{'selector'：“#tinymce”}）；
$（文档）.ready（函数（）{
$（'.tooltip'）.tooltip（）；
$（'#click'）。单击（函数（）{
console.log（$（'#iframeID'）.contents（）.find（'.tooltip'））；
$（'.#iframeID'）.contents（）.find（'.tooltip'）.tooltip（）；
$（'tinymce'）.html（'somediv4somediv5somediv6'）；
var t=tinymce.editors['tinymce']；
t、 加载（）；
log（$（t.getBody（））.find（'div.tooltip'）；
$（t.getBody（））.find（'div.tooltip'）.tooltip（）；
});
});
点击
一些DIV1
某个部门2
某个部门3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>Bind</title>
<style type="text/css">
.toolTip {width:100px;}
.myTooTip {
z-index:99999;
border:1px solid #CECECE;
background:white;
padding:10px;
display:none;
color:black;
}
</style>
</head>
<body>
<div class="tooltip" title="Some Div7">Some DIV7</div>
<div class="tooltip" title="Some Div8">Some DIV8</div>
<div class="tooltip" title="Some Div9">Some DIV9</div>
</body>
</html>
绑定
.工具提示{宽度：100px；}
myTooTip先生{
z指数：99999；
边框：1px实心#CECECE；
背景：白色；
填充：10px；
显示：无；
颜色：黑色；
}
一些第七组
一些DIV8
一些DIV9
e.pageYe.pageY我希望这能最终实现在查看您的JSBin后，我会询问更多详细信息，请提供与工具提示相关的问题详细信息，具体是什么不起作用以及在哪个浏览器中..@MarmiK。很抱歉耽搁了你，我已经出城几天没有上网了。使用FF时，工具提示不会出现，悬停时默认浏览器也不会显示标题。对于IE和Chrome，悬停元素的标题会插入DOM中，以后不会删除。你看过我的JSBin了吗？如果是的话，你看到了什么？谢谢你好，MarmiK，我看到你修改了我写的工具提示插件，而不是jQueryUI工具提示。请注意，它仍然有bug（工具提示同时出现在两个位置）。我还想使用jQueryUI工具提示，而不是我的。感谢它的马车，我知道它表明，我已经为你提供了道路，你必须做其余的事，我已经指出了问题所在。它不应该有任何其他问题，如果你在
tinymce