Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > динамическая подгрузка image и текста


Автор: almen 25.4.2007, 16:04
при наведении курсора на button в отдельном окне в зтом же layout (без перезагрузки страницы) выводится картинка. 

Использовал этот код

<a onmouseover="MM_swapImage('bild','','../images/test.jpg',1)" 
onmouseout=MM_swapImgRestore()href="test.htm">Test</a>

а там, где должна появляться картинка, вернее меняться на новую естественно c ID 

<img src="../images/test1.jpg" width="142" height="106" id="bild">

все OK.

проблема следующая:

все тоже самое плюс вывод отформатированного техта, описывающего зту картинку также в строго определенном месте страницы.

Автор: NightmareZ 25.4.2007, 16:36
Ну, а в чём, собственно проблема?

Автор: almen 25.4.2007, 17:10
не знаю как это сделать для текста

Автор: pirrat 25.4.2007, 18:48
если я правильно понял задачу,то что то типа того:
Код

<html>
<head>
<title></title>
<style  type="text/css">
.tip            {display: none; padding-top: 3px; text-decoration: none;}
-->
</style>
</head>
<script>
<!--
www = (document.getElementById) ? true : false;
var opened=0;
function list(idname){
var div;
if(!(www||ie4))return;
if(www){
    div=document.getElementById(idname);
}else{
    div=document.all[idname];
}
if(opened){
    opened.style.display='none';
    if(opened==div){opened=0;return false;}
}
div.style.display='block';
div.style.position='absolute';
div.style.left='100';
div.style.top='100';
opened=div;
return false;
}
//-->
</script>
<body bgcolor="#FFFFFF">

<a href="#" onmouseover="return list('info1')" onmouseout="return list('info1')">наведи курсор</a><div id="info1" class=tip ><table width="300" border="0" cellpadding="5" cellspacing="1"><tr><td >
<p align=justify>
<img src="1.gif" width="60" height="60" border="1" alt="" align="left"><b>БЛОК 1</b><br> Текст первой подсказки. Текст первой подсказки. Текст первой подсказки. Текст первой подсказки. Текст первой подсказки. Текст первой подсказки. Текст первой подсказки.
</td></tr></table></div>

</body>
</html>

Автор: almen 25.4.2007, 19:12
спасибо за помощь, все так и не совсем так. 

На страничке несколько батонов, каждый при наведении курсора высвечивает свою картинку при наведении на него курсора в левом нижнем углу layoutа (т.е. в своей тбл.) 

Теперь необходимо высветить одновременно текст в другой таблице в правом нижнем углу layoutа. Как сделать это разделение?

Добавлено через 9 минут и 30 секунд
вот код смены картинки

 <a onmouseover="MM_swapImage('bild','','../images/test.jpg',1)" 
onmouseout=MM_swapImgRestore()href="test.htm">Test</a>

как мне сюда добавить ваш 

onmouseover="return list('info1')" onmouseout="return list('info1')"
 

Автор: pirrat 25.4.2007, 19:27
функции MM_swapImage и MM_swapImageRestore дайте посмотреть!!!!

Автор: almen 25.4.2007, 19:35
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

Добавлено через 37 секунд
function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

Автор: pirrat 25.4.2007, 19:54
кхм,зря я попросил функции ))
кароче предлагаю так:
ссылку изменить на 
Код

 <a onmouseover="MM_swapImage('bild','','../images/test.jpg',1); change_text('ТУТ ТЕКСТ')" 
onmouseout="MM_swapImgRestore(); change_text('')"href="test.htm">Test</a>


в javascript дописать функцию
Код

function change_text(new_t){
        document.getElementById('text').innerHTML = new_t;
        
    }


 и соответвенно назначить нужной ячейки(там где должен появляться текст) id="text" а отформатировать текст можно без проблем через css...

Автор: almen 25.4.2007, 20:00
Респект и наилучшие пожелания

Добавлено через 14 минут и 30 секунд
при тестировании старый текст исчезает, а новый не появляется

Автор: pirrat 25.4.2007, 20:23
 smile всмысле? не понял в чём проблема?

Автор: almen 25.4.2007, 20:28
исправил ошибку
теперь текст появляется, но после того, как курсор уходит с баттона не загружается предыдущий текст

Автор: almen 25.4.2007, 21:09
И как правильно отформатировать текст?
Допустим в ячейке я задал класс, а как ввести брухи или курсив?
Понимаю, что вопросов слишком много sorry!

Автор: pirrat 25.4.2007, 21:36
ну это уже совсем к JS не относиться!
учим матчасть http://htmlbook.ru/content/?id=55

Код

.text {
font-style: italic; /*курсив*/
font-weight: bold; /*жирный*/
}

Автор: almen 26.4.2007, 08:59
да нет, стайлшиты я знаю, речь идет о тексте, который расположен здесь change_text('ТУТ ТЕКСТ')

И все таки, есть ли возможность вернуть предыдущий текст?

Если в change_text  в

onmouseout="MM_swapImgRestore(); change_text('предыдущий текст')"

вставить предыдущий, то все играет. Однако это слишком громоздко и неудобно.

Для картинки работает функция MM_swapImgRestore(), а для текста?

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)