Chrome下看最新回贴的问题

黑山老妖

问题请看：http://www.oursteps.com.au/bbs/viewthread.php?tid=286980

悬赏50分寻求解决方案。

dalaohu

老妖， 你用这个吧， 所需的改动最小。

$(document).mousemove(function(e){
      MouseX = e.pageX;
      MouseY = e.pageY;
   });

title 里嵌html是不标准，但bug 不是处在这里。要改html， 要通过php， 对你动作太大。

bug 是在 mouseX, Y 值在chrome 里不准。

你把 x，y 值在jquery 里付好， 其余code 不用改动。

dalaohu

Chrome的确有这个问题， 鼠标上去时看不到tooltip

CSS 的问题。

dizzypiggy

what is tooltip?

o2h2o

呵呵
其实这是新足迹的 代码问题
那个 tooltip 里面新足迹用了 html 内嵌html 不是标准的格式
不同的浏览器对于这种非标准的东西 解析不同


<a href="viewthread.php?tid=281466&amp;extra=page%3D1" style="color: blue" title="最后跟贴        ：<font color=blue><b></b><BR>一半工资不交税？这怎么安排？这肯定是福利，而且是很贵的那种</font><br><font class=numtxt>最后发表：bulaohu</font>" >各位在澳洲工作的同学们，你们公司都提供什么福利和待遇？</a></span>

注意到title 里面的东西了吗?

[ 本帖最后由 o2h2o 于 2010-11-15 14:33 编辑 ]

黑山老妖

嗯，肯定是代码解析问题。
寻求正确的代码。

o2h2o

title 里面 应该是 plain text
而不是 html

有些浏览器对这个也认
但是实在是非标准的写法

如果想保持 这个tooltip 的 格式话
可以改写成 javascript + css 的写法,而不是 直接用 html 来实现

[ 本帖最后由 o2h2o 于 2010-11-15 14:39 编辑 ]

dalaohu

title 里内嵌html tag， browser 只是把tag 作为 text 显示出来而已。

然后肯定有一个js 把这些tag 重新生成了一个popup。

问题就才这个js+css 里。 跟chrom不兼容。

黑山老妖

如果用javascript+CSS是不是比较麻烦？要做很多修改？

garysu

safari也不行，求解决safari as well 。。。

黑山老妖

原帖由 garysu 于 15/11/2010 14:49 发表
safari也不行，求解决safari as well 。。。

可能是一个问题。

bulaohu

原帖由 garysu 于 2010-11-15 14:49 发表
safari也不行，求解决safari as well 。。。

root cause应该是一样的

dalaohu

原来是inline javascript。
问题是在于 MouseX， MouseY 的值， 明显在chrome 里不对。


var sPop = null;
var postSubmited = false;

document.write("<style type='text/css'id='defaultPopStyle'>");
//quicksand 2006-6-3 更改透明度与popup窗口底色
document.write(".cPopText { font-family: Tahoma, Verdana;  background-color: #d6e0ef; border: 1px #666666 solid; font-size: 12px; padding-right: 4px; padding-left: 4px; line-height: 18px; padding-top: 2px; padding-bottom: 2px; visibility: hidden; filter: Alpha(Opacity=95)}");

document.write("</style>");
document.write("<div id='popLayer' style='position:absolute;z-index:1000' class='cPopText'></div>");
//document.write("<div id='popLayer' style='position:absolute;z-index:1000' ></div>");


function showPopupText(event) {
        if(event.srcElement) o = event.srcElement; else o = event.target;
        MouseX=event.x ? event.x : event.pageX;;
        MouseY=event.y ? event.y : event.pageY;;
        //MouseY=event.offsetY;
        if(o.alt!=null && o.alt!="") { o.pop=o.alt;o.alt="" }
        if(o.title!=null && o.title!=""){ o.pop=o.title;o.title="" }
        if(o.pop!=sPop) {
                sPop=o.pop;
                if(sPop==null || sPop=="") {
                        document.getElementById("popLayer").style.visibility="hidden";
                } else {
                        if(o.dyclass!=null) popStyle=o.dyclass; else popStyle="cPopText";
                        document.getElementById("popLayer").style.visibility="visible";
                        showIt();
                }
        }
}

function showIt() {
        document.getElementById("popLayer").className=popStyle;

        //quicksand 2006-6-3 解决第一个html代码总是不能正常显示的问题
        //document.getElementById("popLayer").innerHTML=sPop.replace(/<(.*)>/g,"&lt;$1&gt;").replace(/\n/g,"<br>");;
        document.getElementById("popLayer").innerHTML=sPop;
        //quicksand 2006-6-3 不让popup窗口过大过长
        popWidth=document.getElementById("popLayer").clientWidth/2;
        popHeight=document.getElementById("popLayer").clientHeight/2;

        if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24; else popLeftAdjust=0;
        if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24; else popTopAdjust=0;
        document.getElementById("popLayer").style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
        document.getElementById("popLayer").style.top=MouseY+12+document.documentElement.scrollTop+popTopAdjust;
        //document.getElementById("popLayer").style.left=MouseX;
        //document.getElementById("popLayer").style.top=MouseY;
        //alert(document.documentElement.scrollTop);
}
if(!document.onmouseover) {
        document.onmouseover = function(e) {
                if (!e) showPopupText(window.event); else showPopupText(e);
        };
}

o2h2o

原帖由 黑山老妖 于 2010-11-15 14:49 发表
如果用javascript+CSS是不是比较麻烦？要做很多修改？

不用做 很多修改
就是 界面的东西
不麻烦

黑山老妖

原帖由 dalaohu 于 15/11/2010 14:56 发表
原来是inline javascript。
问题是在于 MouseX， MouseY 的值， 明显在chrome 里不对。


var sPop = null;
var postSubmited = false;

document.write("");
//quicksand 2006-6-3 更改透明度与popup窗口底色
document. ...

What's the correct code to fix this problem?

o2h2o

原帖由 dalaohu 于 2010-11-15 14:48 发表
title 里内嵌html tag， browser 只是把tag 作为 text 显示出来而已。

然后肯定有一个js 把这些tag 重新生成了一个popup。

问题就才这个js+css 里。 跟chrom不兼容。 ...

不同的 浏览器 如何处理还真的是不一样吧,
应该不是 只是显示text, 很多 浏览器会尝试着去correct something,具体浏览器怎么去fix实现就不知道了
最好的办法就是 按照标准写法,因为一般标准html 浏览器都是有很大的兼容性的

这段 代码 在 title 里面 很有问题,如果用js dom去fetch,很有可能fectch 出来的就是 错的

可以include一个 jqeruy lib 然后去找 mouse 的位置

我们写了 您可以上传吗?

[ 本帖最后由 o2h2o 于 2010-11-15 15:07 编辑 ]

dalaohu

最好的做法是， 根本都不用任何js。

把tooltip的内容 写在一个hidden 的div 里
<div>tooltip content in html</div>

然后css 里 on hover event. set this div to visible.

或则你就修好， MouseX, Y in chrome

黑山老妖

如果有正确的解决方案，我可以修改。
最好有符合国际标准的方案。

o2h2o

可惜 title 里面的 东西
有动态 php code
所以提出 title 里面的东西到其他地方需要知道你 php 的源代码
不能blind 修改

不管最后的修改 用不用的到这个 title 里面的东西
还是建议把title 的改了
别内嵌 html了
非标准的很容易出错

我以前 parse 新足迹的 html 代码的时候
第一个 报错的地方 就是 这个title 部分
很多html 解析器都认不出 这种写法

[ 本帖最后由 o2h2o 于 2010-11-15 15:15 编辑 ]

澳贼

马上封id封ip

黑山老妖

原帖由 o2h2o 于 15/11/2010 15:12 发表
可惜 title 里面的 东西
有动态 php code
所以提出 title 里面的东西到其他地方需要知道你 php 的源代码
不能blind 修改

不管最后的修改 用不用的到这个 title 里面的东西
还是建议把title 的改了
别内嵌 html了
非 ...

修改title没有问题。可是这不会解决mouseX和mouseY的问题吧？

澳贼

dalaohu

o, 貌似足迹没有jquery

那你header 里加一句。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

degra

should be fixed by now.

bulaohu

这里没法加分，我去专业版开个帖子，dalaohu你进来报道领分吧

dalaohu

wow, 真的好了， 怎么修的？

微笑的假面

chrome行了，ie又不行了

degra

its a webkit bug http://code.google.com/p/chromium/issues/detail?id=3862

http://code.google.com/p/chromiu ... e038eadb4e0d512da95

乱码

看了一下js的source code，问题出在forumdisplay.php中的line 1313，document.getElementById("popLayer").style.top=MouseY+12+document.documentElement.scrollTop+popTopAdjust;
它用到了document.documentElement.scrollTop，这个数值在chrome中不准，是个bug

http://stackoverflow.com/questio ... i-or-chrome-windows

这个帖子有work around。


不过，ourstep现在用的js也很惊人(forumdisplay.php, line 1318).

if(!document.onmouseover) {
    document.onmouseover = function(e) {
        if (!e) showPopupText(window.event); else showPopupText(e);
    };
}

上面的例子是在这个page中，每次move mouse，都会触发这个event handler，99%的处理是浪费，除非他是帖子的anchor，而且让debug的过程变得异常艰难，建议只对帖子的anchor作mouseover的响应，用jquery应该可以简化一点。

dalaohu

ie里有js error

你google 一下吧， 不行 就

if(ie) , if (chrome) ...etc

方正他就是mouseX, Y cross-browser 的事。