먼저이 프로젝트에서 Wordpress를 사용하고 있지만이 문제는 WP 관련 문제로 생각하지 않습니다.Scriptaculous Appear effect는 Google지도를 보이는 iframe 영역 밖으로 이동합니다.
Google지도 및 지역 어메니티 정보 (예 : 식당)가있는 iFrame을 삽입하는 WP (Local Market Explorer) 플러그인을 사용하고 있습니다. iFrame 및 콘텐츠는 API를 통해 Walkscore.com에 의해 게재됩니다.
나는 Scriptaculous Appear 효과를 사용하여 페이지의 컨테이너 div를 희미하게하고 싶습니다. 이 효과는 페이지에서 인라인 CSS를 사용하여 컨테이너 div에 대해 "display : none"을 설정해야합니다. 그러나지도가 포함 된 iFrame이 희미 해지면 iframe에 포함 된지도가 iFrame 디스플레이 외부로 이동합니다. "display : none"을 제거하거나 "display : inline"을 설정하면 iFrame이 올바른 맵 디스플레이로 반환되지만 Appear 효과는 작동하지 않게됩니다.
가로 스크롤 막대가 나타나기 때문에 단순히 표시하지 않고지도가 iframe의 표시 경계 바깥으로 이동했다고 생각합니다. 지도가 올바르게 표시되면 세로 스크롤 막대가 있지만 가로 막대는 없습니다.
나를 혼란스럽게하는 것은 Stereotabs이라는 탭 콘텐트 스크립트에 구현 된 Scriptaculous 페이드가 잘 작동한다는 것입니다. 지도 내용에 영향을주지 않고 탭 내용이 페이드 인됩니다. 그러나 Stereotabs 코드는 Appear 효과에 인라인 CSS를 사용하지 않습니다. Stereotabs js 코드는 앞의 링크를 통해 사용할 수 있습니다. Scriptaculous Appear를 인라인 CSS와 함께 사용하면 Stereotab이 활성화되어 있는지 여부에 관계없이지도가 움직입니다.
제 질문은 : 왜 인라인 CSS를 사용하여 디스플레이 속성을 'none'으로 설정하면 Scriptaculous가 iFramed Google지도 콘텐츠를 방해하게됩니까? 다른 모든 iFramed, ummapped 내용 (예 : Yelp, Schools, Zillow stats 등)이 올바르게 나타납니다.
코드는 다음과 같지만 WP- 단축 코드로 인해 얼마나 유용할지 모릅니다. 나 전체 코드를 제시 할 수 없었던 ... 그 워드 프레스 작업의 많은 단점과 불만 중 하나입니다. 어떤 도움
<html>
<head>
<script src="http://www.mysite.com/wp-includes/js/prototype.js"></script>
<script src="http://www.mysite.com/wp-includes/js/scriptaculous/scriptaculous.js"></script>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
new Effect.Appear('content-wrap', {delay:1.0});
}
</script>
<div id="content-wrap" style="display: none">
<?php echo do_shortcode('[lme-module module="walk-score" zip="30312"]'); ?>
</div>
</body>
</html>
감사합니다.
반
고마워 ... 나는 단 하나 뿐이라고 걱정했다. 프로토 타입과 대본과 관련하여 내가 경험 한 유일한 불만이 아닙니다. – VanAlbert