Компьютерный форум NoWa.cc Здесь может быть Ваша реклама
Правила Форума
редакция от 22.06.2020
Портал .::2BakSa.WS::.
Вернуться   Компьютерный форум NoWa.cc > В помощь вебмастеру > Вeб Дизайн > CSS

Уважаемые пользователи nowa.cc и 2baksa.ws. У нас сложилось тяжёлое финансовое положение. Мы работаем для вас вот уже более 15 лет и сейчас вынуждены просить о помощи. Окажите посильную поддержку проектам. Мы очень надеемся на вас. Реквизиты для переводов ниже.
Webmoney Webmoney WMZ: 826074280762 Webmoney WME: 804621616710
PayPal PayPal_Email E-mail для связи по вопросу помощи
Кошелёк для вашей помощи YooMoney 4100117770549562
YooMoney Спасибо за поддержку!
Ответ
 
Опции темы Опции просмотра Language
Старый 17.11.2011, 19:33   #1
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Добавить стиль к блоку с изображениями

Ниже приведён код вывода превью изображений, изображения выводятся
горизонтально в одну линию, никак не могу добиться, чтобы когда количество превью превышает ширину блока, появлялась горизонтальная полоса прокрутки.


<style type="text/css">
.images{position:relative; float:left}
</style>


<?php if (isset($filenames)) : ?>
<?php foreach ($filenames as $k => $filename) : ?>
<div id="images">
<img src="<?php echo HOST . 'imagesCatalog/' . $filename ?>"
alt="" id="photo_mini_<?php echo $k ?>"class="photo_mini" />
</div>
<?php endforeach ?>
<?php endif ?>
Paraplegic вне форума
 
Ответить с цитированием Вверх
Здесь может быть Ваша реклама
Здесь может быть Ваша реклама


Реклама: как называется табличка на двери кабинетаэдуард алиевфраншиза магазина белорусских продуктовпилки для ювелирного лобзика по металлуиз санкт-петербурга в карелию на теплоходе


Старый 18.11.2011, 07:11   #2
zss
Постоялец
 
Пол:Мужской
Регистрация: 05.02.2007
Адрес: Москва
Сообщений: 662
Репутация: 271
По умолчанию Re: Добавить стиль к блоку с изображениями

Попробуйте
.images{position:relative; float:left;overflow:scroll}
__________________
Сергей Сергеевич
zss вне форума
 
Ответить с цитированием Вверх
Старый 18.11.2011, 12:54   #3
Paraplegic
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Re: Добавить стиль к блоку с изображениями

Спасибо конечно, что откликнулись, но если б всё было так просто, то не обращался бы за помощью. Всё это и не только перепробавал - не получается...
Paraplegic вне форума
 
Ответить с цитированием Вверх
Старый 18.11.2011, 14:03   #4
zss
Постоялец
 
Пол:Мужской
Регистрация: 05.02.2007
Адрес: Москва
Сообщений: 662
Репутация: 271
По умолчанию Re: Добавить стиль к блоку с изображениями

overflow:scroll надо добавить к обрамляющему блоку,
а блок с изображением позиционировать абсолютно, тогда получается
Код:
<head>
<style type="text/css">
.images{position:absolute; float:left;top:0;}
</style>
<script language="javascript">
function SetPosition(id,n,imageWidth)
{
	st=document.getElementById(id).style;
	st.left=n*imageWidth+"px";
}
</script>
</head>
<body>
<div style="overflow:scroll">
<div class="images" id="1"><img src="a.jpg"/></div>
<div class="images" id="2"><img src="a.jpg"/></div>
<div class="images" id="3"><img src="a.jpg"/></div>
<div class="images" id="4"><img src="a.jpg"/></div>
</div>
<script language="javascript">
SetPosition("1",0,200);
SetPosition("2",1,200);
SetPosition("3",2,200);
SetPosition("4",3,200);
</script>
</body>
__________________
Сергей Сергеевич
zss вне форума
 
Ответить с цитированием Вверх
Старый 18.11.2011, 17:01   #5
Paraplegic
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Re: Добавить стиль к блоку с изображениями

Сергей Сергеевич, извините, я пока чайник в этих делах, но для чего это,
<div class="images" id="1"><img src="a.jpg"/></div>
<div class="images" id="2"><img src="a.jpg"/></div>
<div class="images" id="3"><img src="a.jpg"/></div>
<div class="images" id="4"><img src="a.jpg"/></div>
если у меня изображения вытаскиваются из БД и их может быть разное кол-во
Paraplegic вне форума
 
Ответить с цитированием Вверх
Старый 18.11.2011, 18:56   #6
zss
Постоялец
 
Пол:Мужской
Регистрация: 05.02.2007
Адрес: Москва
Сообщений: 662
Репутация: 271
По умолчанию Re: Добавить стиль к блоку с изображениями

Ну, я это написал для примера.
У Вас в цикле php код должен для каждого изображения вставлять div с изображением
<div class="images" id="n"><img src="xxxxxxxx.jpg"/></div>
и функцию SetPosition("n",n,ШиринаИзображения),
n - номер изображения.

p.s. обратите внимание, что стиль .images - это стиль класса, а не одиночного элемента
(у Вас была ошибка).
__________________
Сергей Сергеевич

Последний раз редактировалось zss; 18.11.2011 в 18:58..
zss вне форума
 
Ответить с цитированием Вверх
Старый 18.11.2011, 21:40   #7
Paraplegic
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Re: Добавить стиль к блоку с изображениями

Если б ещё кто рассказал как это всё слепить, вместе с моим php кодом. Эх, трудно быть бестолковому
Paraplegic вне форума
 
Ответить с цитированием Вверх
Старый 19.11.2011, 11:02   #8
zss
Постоялец
 
Пол:Мужской
Регистрация: 05.02.2007
Адрес: Москва
Сообщений: 662
Репутация: 271
По умолчанию Re: Добавить стиль к блоку с изображениями

примерно так.
Код:
<head>
<style type="text/css">
.images{position:absolute; float:left;top:0;}
</style>
<script language="javascript">
function SetPosition(id,n,imageWidth)
{
	st=document.getElementById(id).style;
	st.left=n*imageWidth+"px";
}
</script>
</head>
....
<div style="overflow:scroll">
<?php 
if (isset($filenames))
{ 
     $i=0;
     foreach ($filenames as $k => $filename) 
     {
         echo '<div class="images" id="'.$i.'">';
         echo '<img src="'. HOST . 'imagesCatalog/' . $filename. ' " id="photo_mini_'.$k.' "class="photo_mini" />';
         echo '</div>';
         echo '<script language="javascript">';
         echo 'SetPosition("'.$i.'",'.$i.',200)';
         echo '</script>';
         $i++; 
      }endforeach;

}endif;
?>
</div>
__________________
Сергей Сергеевич

Последний раз редактировалось zss; 19.11.2011 в 11:20..
zss вне форума
 
Ответить с цитированием Вверх
Старый 19.11.2011, 12:40   #9
Paraplegic
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Re: Добавить стиль к блоку с изображениями

Выдаёт ошибку:
Parse error: syntax error, unexpected T_ENDFOREACH in C:\WebServers\home\luban.by\www\skins\tpl\form\sho w.tpl on line 79

52 <head>
53 <style type="text/css">
54 .images{position:absolute; float:left;top:0;}
55 </style>
56 <script language="javascript">
57 function SetPosition(id,n,imageWidth)
58 {
59 st=document.getElementById(id).style;
60 st.left=n*imageWidth+"px";
61 }
62 </script>
63 </head>
64 ....
65 <div style="overflow:scroll">
66 <?php
67 if (isset($filenames))
68 {
69 $i=0;
70 foreach ($filenames as $k => $filename)
71 {
72 echo '<div class="images" id="'.$i.'">';
73 echo '<img src="'. HOST . 'imagesCatalog/' . $filename. ' " id="photo_mini_'.$k.' "class="photo_mini" />';
74 echo '</div>';
75 echo '<script language="javascript">';
76 echo 'SetPosition("'.$i.'",'.$i.',200)';
77 echo '</script>';
78 $i++;
79 }endforeach;
80
81 }endif;
82 ?>
83 </div>
Paraplegic вне форума
 
Ответить с цитированием Вверх
Старый 19.11.2011, 13:57   #10
zss
Постоялец
 
Пол:Мужской
Регистрация: 05.02.2007
Адрес: Москва
Сообщений: 662
Репутация: 271
По умолчанию Re: Добавить стиль к блоку с изображениями

уберите endforeach и endif:
Код:
77 echo '</script>';
78 $i++;
79 }
80
81 }
Если еще будут ошибки, пользуйтесь интернет справочниками,
например, по вышеприведенной ошибке
http://php-mysql.h1.ru/foreach.php
там видно, что после закрывающей скобки комментарий не предусмотрен.
Почему работал Ваш первоначальный код - непонятно.
__________________
Сергей Сергеевич

Последний раз редактировалось zss; 19.11.2011 в 14:01..
zss вне форума
 
Ответить с цитированием Вверх
Старый 19.11.2011, 16:33   #11
Paraplegic
Неактивный пользователь
 
Аватар для Paraplegic
 
Пол:Мужской
Регистрация: 07.02.2011
Сообщений: 19
Репутация: 1
По умолчанию Re: Добавить стиль к блоку с изображениями

Кое-что подправил в стилях, и о чудо, получилось то что надо, но появилась другая проблема - перестал работать скрипт увеличения изображения по клике на превью.
Paraplegic вне форума
 
Ответить с цитированием Вверх
Ответ

Опции темы
Опции просмотра

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
вопрос владельцам струйников Lexmark Z45/55/65, по блоку питания s1974 Компьютерные проблемы 1 17.04.2011 00:13
Не получается подключить материнскую карту к системному блоку Nikiss Компьютерные проблемы 1 13.03.2011 09:45
Программа по блоку доступа в папку LexRider Скорая помощь 11 30.01.2009 20:50
Проблема с изображениями в .chm Hotel Six Microsoft Windows 3 28.01.2008 22:29

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход


Текущее время: 12:26. Часовой пояс GMT +3.


Copyright ©2004 - 2024 2BakSa.WS

Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2024, vBulletin Solutions, Inc. Перевод: zCarot
Время генерации страницы 0.17228 секунды с 11 запросами