Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.03.2010, 18:41
Интересующийся
Отправить личное сообщение для возжаждавший Посмотреть профиль Найти все сообщения от возжаждавший
 
Регистрация: 24.02.2010
Сообщений: 27

Как вставить изображение в документ, не используя таблицу?
Друзья! То есть я щас чтобы вставить картинку куда-нибудь в центр документа, должен создавать таблицу 3X3 и в среднюю ячейку помещать эту картинку.

Это вообще-то как-то не укладывается у меня в голове. Согласитесь, для определения координат картинки по большому счёту надо две цифры всего:
Допустим, координаты верхнего левого угла. Всё!
ЕСть какой-нибудь способ? Может, я малочитал, не знаю.

ТОгда, если мы захотим двигать картинку по экрану это будет просто. Изменяем ординату, допустим, и картинка движется. Много проще, чем вот в этом МОЁМ коде. (Движение картинки)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Шаблон</title>
 <script>
 i= 0;  
  

  setInterval("f()", 40)
// shirina= table.getElementsByTagName("tr")[0].getElementsByTagName("th")[0].width   
  
  function f () {
   i++

   //Это ширина первого столбца первой ячейки, её и меняем.
   shir= i+"%"
   var table= document.getElementById("tablitsa")
    table.getElementsByTagName("tr")[0].getElementsByTagName("th")[0].width= shir
//    shirina= "75%";
  }
 </script>
</head>

<body onload="f()">
<table width="100%" border="0" id="tablitsa">
  <tr>
    <th width="14%" height="69" scope="row">&nbsp;</th>
    <td width="11%">&nbsp;</td>
    <td width="75%">&nbsp;</td>
  </tr>
  <tr>
    <th height="98" scope="row">&nbsp;</th>
    <td><img src="file:///C|/Documents and Settings/ser/Рабочий стол/eee_1.jpeg" width="128" height="96" /></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th height="167" scope="row">&nbsp;</th>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
<p>&nbsp;</p>
</body>
</html>


Собсно,тут всё понятно, через каждые 40 мс вызывается функция, меняющая ширину первого столбца (хотелось бы, повторюсь: абсциссу верхнего левого угла) и картинка движется. КАртинка должна быть 148 на 96 пикселей.
Ответить с цитированием
  #2 (permalink)  
Старый 05.03.2010, 19:36
Аватар для subzey
Пионэр
Отправить личное сообщение для subzey Посмотреть профиль Найти все сообщения от subzey
 
Регистрация: 16.11.2009
Сообщений: 1,322

Возможно, Вам пригодится запись из моего бложика.

Другой способ, без выдёргивания элемента из потока. У любого элемента с display: table-cell есть вертикальное выравнивание. Делаем таблицу на любой размер (хоть 100% экрана), внутри нее одну ячейку, у ячейки
vertical-align: middle;
text-align: center

Вставляем туда что угодно (кроме флоатов), и это что угодно центруется.

Если Вам не важен ie6, display: table-cell можно задать даже body (именно так центруются картинки в опере, когда они открыты отдельно ).

UPD: На расположение блоков text-align: center не распространиется, им нужно задавать:
margin-left: auto;
margin-right: auto;

Последний раз редактировалось subzey, 05.03.2010 в 19:38.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вставить переменную в RegExp ? miller Общие вопросы Javascript 6 09.12.2015 14:12
Как удалить таблицу созданную в JS? konstantinopol Общие вопросы Javascript 9 10.09.2011 10:55
Как предварительно загруженное изображение сделать бэкграундом? hrundel Общие вопросы Javascript 1 02.08.2009 12:45
Подскажите, пжлст, как вывести в тот же документ результат ф-ции? LexXxeL Элементы интерфейса 4 13.05.2009 13:26
Как считать файл с винта и вставить его в mht-файл ? potkin Общие вопросы Javascript 4 26.08.2008 14:17