Вывод бокса через js
Здравствуйте!
Столкнулся с небольшой проблемой. Сделал небольшой бокс для показа изображения по клику мышки, т.е. при клике на изображение(превью) появляется бокс и в нём отображется изображение в нормальном размере, но не получается вывести этот бокс через Js. <p><a rel="simplebox" href="./images/.jpg"> <img class="pop1" src="./images/.jpg"></a></p> Если просто прописать в тегах, то всё работает, а вот если же попытаться вести через Js, то бокс не отрывается. Вместо него изобрежение отрывается в новой вкладке(?). в Js вывожу примерно так function check() { var cV=document.getElementById('inp').value; if(document.getElementById('inp').value == 'face') { document.getElementById('finded1').innerHTML="<a rel='simplebox' href='./images/.jpg'><img class='pop1' src='./images/.jpg'></a>"; innerHTML использую для того, чтобы убирать прошлое изображение и выводить новое. Так же, если не трудно, подскажите пожалуйста, как можно выводить большое количество изображений во что-то типа <p class=""> Сейчас делаю вывод изобрежние одного через Айди, но хотелось бы реализовать вывод 5ти изображений при нажатии на поиск. |
Цитата:
|
Цитата:
Тестовый пример? Кинуть кусок кода сюда или можно как-нибудь сэмулировать всё это дело? |
Iru121,
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Цитата:
Могу скинуть код сайта, но соответственно бокс работать не будет. Вообще использую симплбокс, который легко гуглится. Могу в принцпе на него ссыль кинуть и кусок своего сайта. Так будет норм? |
Iru121,
пишите ссылку и описание куда жмак где зырк какие мечт. |
Цитата:
Суть в том, что при поиске слова вылезает картинка маленького размера и при нажатии на неё, она должна увеличиваться. Всё отлично работает в хтмл, но если же попытаться вызвать картику через скрип, она не будет увеличиваться, а просто открывается как новое окно в черном фоне. Так же хотелось бы узнать, как можно при поиске слова вывести сразу несколько изображений. Была идея создать много тегов <p id="">, но что-то мне совсем не нравится такая идея. скрип брал вроде отсюда http://get-do-ok.ru/skript-uvelichen...-nazhatii.html
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>Search</title>
<style type="text/css">
img{
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<p class="hist"><input type="text" id="inp"/><button id="find" onclick="check();">Enter</button></p>
<div id="finded">
<p id="finded1"></p>
</div>
<js run>
<script type="text/javascript" src="simplebox_util.js"></script>
<script type="text/javascript">
function check() {
var cV=document.getElementById('inp').value;
if(document.getElementById('inp').value == 'troll')
{
document.getElementById('finded1').innerHTML="<a rel='simplebox' href='http://s00.yaplakal.com/pics/pics_original/2/3/3/8037332.jpg'><img class='pop1' src='http://s00.yaplakal.com/pics/pics_original/2/3/3/8037332.jpg'></a>";
}
else if (document.getElementById('inp').value == 'face')
{
document.getElementById('finded1').innerHTML="<a rel='simplebox' href='http://mirgif.com/KARTINKI/fraktal/fraktal37.jpg'><img src='http://mirgif.com/KARTINKI/fraktal/fraktal37.jpg'></a>";
document.getElementById('finded1').innerHTML="<a rel='simplebox' href='http://www.nokiaplanet.com/uploads/posts/2014-11/1415431186_blue-flower-480x800.jpg'></a><img src='http://www.nokiaplanet.com/uploads/posts/2014-11/1415431186_blue-flower-480x800.jpg'></a>";
}
}
(function(){
var boxes=[],els,i,l;
if(document.querySelectorAll){
els=document.querySelectorAll('a[rel=simplebox]');
Box.getStyles('simplebox_css','simplebox.css');
Box.getScripts('simplebox_js','simplebox.js',function(){
simplebox.init();
for(i=0,l=els.length;i<l;++i)
simplebox.start(els[i]);
simplebox.start('a[rel=simplebox_group]');
});
}
})();
</script>
</js>
</body>
|
Iru121,
новую ссылку никто не инициализировал , после добавления на страницу поэтому ничего не происходит. |
Iru121,
смотрите по ссылке пример -- только вместо меню у вас будет инпут. http://javascript.ru/forum/dom-windo...tml#post445212 |
Цитата:
|
| Часовой пояс GMT +3, время: 01:52. |