Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   растянуть div на страницу (https://javascript.ru/forum/jquery/17542-rastyanut-div-na-stranicu.html)

gorilas 23.05.2011 19:14

растянуть div на страницу
 
Добрый день, прошу помощи, второй день бьюсь, не могу разобратся.
Нужно привязать значение width в css к размеру документа $(document) или $(window).
Задача, нужно получить ширину документа, и назначить правило для (#content) width - (минус) 200px.
В идеале конечно должно быть немного подругому, ну хотя бы так сделать.
С ув. Алексей.

nikita.mmf 23.05.2011 19:23

А в чем конкретно задача, может получиться сделать средствами чистого css?

gorilas 23.05.2011 21:32

Цитата:

Сообщение от nikita.mmf (Сообщение 105842)
А в чем конкретно задача, может получиться сделать средствами чистого css?

Есть (галерея) подгружаемая с базы, лежит на главной странице сайта.
Не получается растянуть её на 100% на разных мониторах.
В css значение width = (...%) установить можно только целое число, так как <ui> постоянно подгружается и не имеет точного размера.
Вот и пришла идея, заставить скрипт получить ширину, и менять операяс на эту ширину , ширину div A.
В иделе чтото типа если document witdh = (XXX) то width css. ... = столько-то.
В html болие мения шарю а вот о jquery пока непойму только юсаю, изредка что-то подправлю, ну вобщем не шарю.
Надеюсб на вашу помощь:dance:
С ув. Алексей.

Aetae 23.05.2011 22:02

<html style="background:#dfd;">
  <body>

  <div style="background:#ddf;margin-right:200px">
    <br>100%-200px<br><br>
  </div>
  <br>
  <div style="width:60%">
    <div style="background:#ddf;margin-right:200px">
      <br>60%-200px<br><br>
    </div>
  </div>

  </body>
</html>

gorilas 24.05.2011 14:50

Цитата:

Сообщение от Aetae (Сообщение 105859)
<html style="background:#dfd;">
  <body>

  <div style="background:#ddf;margin-right:200px">
    <br>100%-200px<br><br>
  </div>
  <br>
  <div style="width:60%">
    <div style="background:#ddf;margin-right:200px">
      <br>60%-200px<br><br>
    </div>
  </div>

  </body>
</html>

к сажелегию этот вариант не подходит.
Блок которым надо управлять формируется скриптом, во втарых если ему задать сто% width она будет вычислятся из количества блоков <li> подтянутых с базы даных и умноженое на длину описаную в css.
Тоесть если в галерее 5 img то длина 5Х120px.
Задача получать размер опр. эллемента иммено в px а не в % можно сделать так - ($(window).width();- размер окна иммено в пикселях. Или $(document).width();- размер документа ) затем (послать это значение) на $('.custom_html').width(-200px). Что-то типа такого.
Я могу получить ширину но незнаю как передать её для следующей функции.
Либо надо получить какуюто переменую (Х= width (window)) а потом с етим (Х) работать.
Может кто ещё что предложит.

С ув. Алекасейю

ksa 24.05.2011 15:02

gorilas, ты явно не дооцениваешь возможностей разметки... Было бы ооочень полезно тебе сделать тестовый пример, на котором можно было бы что-то показывать и пробовать.
В противном случае решение проблемы только за твои деньги.

gorilas 24.05.2011 15:07

Цитата:

Сообщение от ksa (Сообщение 105923)
gorilas, ты явно не дооцениваешь возможностей разметки... Было бы ооочень полезно тебе сделать тестовый пример, на котором можно было бы что-то показывать и пробовать.
В противном случае решение проблемы только за твои деньги.

К сожалению незнаю как галерея на local сервере, не знаю как опубликовать. а в сайт вставлять сыровата ещё тема.

ksa 24.05.2011 15:16

gorilas, нам весь твой сайт без надобности... :) Я тебе про маленький тестовый пример пишу... Т.е. нет денег - начинай работать сам. В противном случае начинай копить. ;)

gorilas 24.05.2011 16:18

Цитата:

Сообщение от ksa (Сообщение 105928)
gorilas, нам весь твой сайт без надобности... :) Я тебе про маленький тестовый пример пишу... Т.е. нет денег - начинай работать сам. В противном случае начинай копить. ;)

Спасибо за помощь
вот templeites
<!-- ====================================== product_list ================================= -->
<script type="text/javascript" src="js/111/jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="js/111/jquery.jcarousel.js"></script>
<script type="text/javascript" src="js/111/2.js"></script> 

<!-- ====================================== product_list <link type="text/css" href="1css.css" rel="stylesheet"> ================================= --> 
{literal}
<script type="text/javascript">


</script>
{/literal}
<div id="wrap" align="center">

<ul id="mycarousel" class="jcarousel-skin-tango">
{foreach from=$__products item=_product}
{if $_product.slug}
{assign var=_product_url value="?productID=`$_product.productID`&product_slug=`$_product.slug`"|set_query_html}
{else}
{assign var=_product_url value="?productID=`$_product.productID`"|set_query_html}
{/if}
<li style="width: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE+20}; height: {if $__block_height}{$__block_height}{elseif $_product.thumbnail}{$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE+45}{else}55{/if};">
{if $_product.thumbnail}
<table cellpadding="0" cellspacing="0" style="width: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE}; height: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE};"><tr><td valign="bottom" align="center">
<a href="{$_product_url}">
<img src="{$smarty.const.URL_PRODUCTS_PICTURES}/{$_product.thumbnail|escape:'url'} " alt="{$_product.name|escape:'html'}" width="100" height="100">
</a>
</td></tr></table>
{/if}
<a href="{$_product_url}">{$_product.name}</a>
{if $_product.Price}<div class="totalPrice">{$_product.price_str}</div>{/if}
</li>
{/foreach}
</ul>

</div>


ширину надо назначать в css для селектора
(.jcarousel-skin-tango .jcarousel-clip-horizontal)

ksa 24.05.2011 16:29

Цитата:

Сообщение от gorilas
вот templeites

Т.е. ты считаешь что вот это

<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript" src="js/111/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/111/jquery.jcarousel.js"></script>
<script type="text/javascript" src="js/111/2.js"></script> 
<style type="text/css">
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="wrap" align="center">

<ul id="mycarousel" class="jcarousel-skin-tango">
{foreach from=$__products item=_product}
{if $_product.slug}
{assign var=_product_url value="?productID=`$_product.productID`&product_slug=`$_product.slug`"|set_query_html}
{else}
{assign var=_product_url value="?productID=`$_product.productID`"|set_query_html}
{/if}
<li style="width: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE+20}; height: {if $__block_height}{$__block_height}{elseif $_product.thumbnail}{$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE+45}{else}55{/if};">
{if $_product.thumbnail}
<table cellpadding="0" cellspacing="0" style="width: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE}; height: {$smarty.const.CONF_PRDPICT_THUMBNAIL_SIZE};"><tr><td valign="bottom" align="center">
<a href="{$_product_url}">
<img src="{$smarty.const.URL_PRODUCTS_PICTURES}/{$_product.thumbnail|escape:'url'} " alt="{$_product.name|escape:'html'}" width="100" height="100">
</a>
</td></tr></table>
{/if}
<a href="{$_product_url}">{$_product.name}</a>
{if $_product.Price}<div class="totalPrice">{$_product.price_str}</div>{/if}
</li>
{/foreach}
</ul>
</div>
</body>
</html>


у меня уже будет работать? :)


Часовой пояс GMT +3, время: 23:03.