왼쪽에 세로 막대 역할을하는 div가 있고 그 다음 나머지 (오른쪽)는 IFrame입니다. 내 사이드 바의 너비가 50이고, 마우스가 숨겨진 오른쪽을 향하게하고 마우스가 "< 50 구역에 들어가면"사이드 바가 다시 표시되기를 원합니다.iframe을 통한 마우스 위치
이것이 가능하거나 도메인 간 액세스에 문제가 있습니까?
왼쪽에 세로 막대 역할을하는 div가 있고 그 다음 나머지 (오른쪽)는 IFrame입니다. 내 사이드 바의 너비가 50이고, 마우스가 숨겨진 오른쪽을 향하게하고 마우스가 "< 50 구역에 들어가면"사이드 바가 다시 표시되기를 원합니다.iframe을 통한 마우스 위치
이것이 가능하거나 도메인 간 액세스에 문제가 있습니까?
내가 생각하는 경우 I 귀하의 질문을 바로 이해, 그것은 마우스 위치 (페이지 X/pageY 원칙에 따라) 캡처에 대한 아니에요; 대신 마우스 포인터 및 마우스를 놓는 (마우스를 올리면) 액션이 실행되도록하려는 것입니다.
DOM을 올바르게 작성한 다음 원하는대로 스타일을 지정하면 이러한 결과를 얻을 수 있습니다.
마우스 위치를 예측할 필요없이 표시 할시기와 내용을 숨길시기를 간단하게 지정할 수 있습니다. 이 시나리오에서는 사용자가 원하는대로 50px
을 사용하고 있으며 사용자의 동작에 따라 '표시/숨기기'하고 있습니다. 아래 jsFiddle 작업을 참조하십시오 :
편집 나는 때문에 성능 문제의 .animate()
에 반대 .css()
를 사용하도록 선택할
. 비틀기를 원한다면 알려주세요.
아마 이런 식으로 뭔가 :
HTML
<div id="sidebar" style="float:left; width:50px; background-color:green; height:250px;"></div>
JS는
$("html").mousemove(function(event)
{
var xPos = event.pageX;
if (xPos <= 50)
{
$("#sidebar").show();
}
else
{
$("#sidebar").hide();
}
});
http://jsfiddle.net/5VEzx/
이 코드는 마우스 위치를 감지하는 문제를 일으키는 IFrame을 다루지 않습니다. – leonsas
당신은 iframe을 사용하기 시작하면 관련 합병증은 확실히있다 -이 작동하지 않습니다
<Doctype! html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
body iframe {
margin-left: 100;
border: 2px solid red;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script>
$(function(){
$(document).on('mousemove', function(evt){
$('#pagex').text(evt.pageX);
});
})
</script>
</head>
<body>
<div id="pagex"></div>
<iframe id="theframe">
<div id="innepage"></div>
<script type="text/javascript">
$(document).on('mousemove', function(evt){
console.log(evt);
$('#innerpage').text(evt.pageX);
});
</script>
</iframe>
</body>
</html>
는 사실, 나는 mousemove
청취자 어디을 배치 할 수 없습니다 iframe 내부에서 성공적으로 실행됩니다.
iframe에는 자체 규칙이 있지만, 사람들이 항상 그렇게하기 때문에 상호 작용할 수 있음을 알고 있습니다. 불행히도 은 실제로 작동하지 않으므로 답변이 없습니다.
iframe의 왼쪽 50 픽셀에서 동작을 수행하기 위해 attemps를 처리하는 방법은 무엇입니까? – Bergi