Я просто получил сделанное выполнение этой точной вещи в проекте. Сторона HTML, на которую походят немного это:
<a href="[fullsize]" class="gallerypic" title="">
<img src="[thumbnail pic]" height="90" width="140" alt="[Gallery Photo]" class="pic" />
<span class="zoom-icon">
<img src="/images/misc/zoom.gif" width="32" height="32" alt="Zoom">
</span>
</a>
Затем использование CSS:
a.gallerypic{
width:140px;
text-decoration:none;
position:relative;
display:block;
border:1px solid #666;
padding:3px;
margin-right:5px;
float:left;
}
a.gallerypic span.zoom-icon{
visibility:hidden;
position:absolute;
left:40%;
top:35%;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
a.gallerypic:hover span.zoom-icon{
visibility:visible;
}
я оставил большой образец там на CSS, таким образом, Вы видите, как я решил сделать стиль. Обратите внимание, что я понизил непрозрачность, таким образом, Вы видели через лупу.
Hope это помогает.
РЕДАКТИРОВАНИЕ: Для разъяснения для примера - Вы могли проигнорировать visibility:hidden;
и уничтожить :hover
выполнение, если бы Вы хотели, это было просто способом, которым я сделал это.
В других решениях используется innerHTML
, который не всегда работает в XHTML. Они также очищают только document.body
(все в
все еще присутствует). Вот решение, использующее DOM:
var frame = document.getElementById("myFrame"),
frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.removeChild(frameDoc.documentElement);
В этом решении используется innerHTML
:
var frame = document.getElementById("myFrame"),
frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.documentElement.innerHTML = "";
$ ('# frameID'). ContentWindow.document.body.innerHTML = '';
Как и любой iframe, это работает, только если вы находитесь в том же домене.
Сначала получите документ фрейма:
var frame = $('#frameId').get(0);
var frameDoc = frame.contentDocument || frame.contentWindow.document;
Затем очистите его:
frameDoc.getElementsByTagName('body')[0].innerHTML = "";
Я думаю, это тоже должно сработать:
$('body', frameDoc).html("");
Теперь вы можете что-то сделать с любыми скриптами, которые могут быть загружены в голова, но это должно помочь вам начать.