IE8에서 Raphael을 사용하는 텍스트 링크

저는 Raphael을 사용하여 IE8에서 작동하는 간단한 텍스트 링크를 얻는 데 많은 어려움을 겪고 있습니다. 나는 정상적인 링크처럼 행동하는 텍스트를 원한다. 아래에 내가 가지고 놀고있는 코드 몇 개를 포함시켰다. 클릭을 문자 사이의 간격에 아무것도 하지 않습니다 -IE8에서 Raphael을 사용하는 텍스트 링크

은 호버 기능을 사용하여 손에 변경
이 document.body.cursor 커서를 얻었다
위의 문제는 마우스 오버에도 영향을 미칩니다.

마우스를 처리하기 위해 텍스트 뒤에 사각형, 경계 상자 등의 요소를 추가해야합니까? 어떤 아이디어? 이 문제는 Raphael을 통해 VML을 사용하는 IE8에서만 발생합니다. 당신은이처럼 요소에 클래스를 추가 할 수 있습니다

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico"> 
    <script type="text/javascript" src="js/jquery-1.4.2.js"></script> 
    <script type="text/javascript" src="js/jquery-ui-1.8.4.min.js"></script> 
    <script type="text/javascript" src="js/raphael-min.js" charset="utf-8"></script> 
    <script type="text/javascript"> 
    window.onload = function() { 

    // Creates canvas 320 × 200 at 10, 50 
    var paper = Raphael(10, 50, 420, 400); 

    var lbl = paper.text(50, 40, 'test').attr({ 
     "font" : '14px Helvetica, Arial', 
     stroke : "none", 
     fill : '#ffffff', 
     'text-anchor' : 'middle' 
    }); 

    lbl.node.style.display = 'block'; 
    lbl.node.style.cursor = 'pointer'; 

    lbl.click(function() { 
     alert('hi');  }); 

    lbl.hover(function() { 
     document.body.style.cursor = 'hand'; 
    }, function() { 
     document.body.style.cursor = 'default'; 
    }); 

    } 
    </script> 
</head> 
<body style="background-color: #000000;"> 
    <div id="wrapper" style="background-color: #000000;"> </div> 
</body> 
</html>

출처

2010-08-19 ncatnow

var lbl = paper.text(50, 40, 'test').attr({ 
    font : '14px Helvetica, Arial', 
    stroke : "none", 
    fill : '#fff' 
}), 
blanket = paper.rect().attr(lbl.getBBox()).attr({ 
    fill: "#000", 
    opacity: 0, 
    cursor: "pointer" 
}).click(function() { alert("hi"); });

출처

2010-08-23 09:39:24

나를 도왔던 드미트리에게 감사드립니다. – ncatnow

아직 2 년 후 적용됩니다. –

(IE8에서 작동하지 않습니다) :

lbl.node.className.baseVal += "linked_label";

과 같은 스타일로 : 여기

코드의

.linked_label:hover { 
    cursor: pointer; 
    text-decoration:underline; 
}

자바 스크립트 후크 네가 원한다면.

출처

2013-11-14 05:48:17 duck9

IE8에서 Raphael을 사용하는 텍스트 링크

답변

관련 문제