Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   как передать значение переменной в background-size? (https://javascript.ru/forum/jquery/53012-kak-peredat-znachenie-peremennojj-v-background-size.html)

kroleternal 17.01.2015 13:34

как передать значение переменной в background-size?
 
можно ли передать значение переменной в background-size? единственно работоспособный вид которого я добился это

$('#block').css( 'background-size', '666px 444px' );


либо же в %/cover/contain/auto.

необходимо вместо конкретных значений задать переменные. возможно ли это? если нет, как можно решить ситуацию?
спасибо за ответы

danik.js 17.01.2015 13:44

Цитата:

Сообщение от kroleternal
если нет, как можно решить ситуацию?

А че за ситуация? Откуда эти значения берутся? Зачем менять размер фона?

kroleternal 17.01.2015 15:06

полурезиновый одностраничник, масштабируемый имейдж в фоне. по умолчанию прописано "background-size: cover", но с ним не везде все хорошо. потому написал cover "вручную", то бишь через условие -
примерно так:
var w_w_bg = $(window).width();
		var w_h_bg = $(window).height();
		if( (w_w_bg/w_h_bg) >= 1.7778 ) //соотношение сторон имейджа 16/9
		 { 
		var bg_w_res = w_w_bg;
		var bg_h_res = (w_w_bg/16*9);
		$('.bgwrapper').css( "background-size", "bg_w_res bg_h_res" );
		 }
		 else 
		 {
		var bg_h_res = ($(window).height()-$('#header').height());
		var bg_w_res = (bg_h_res/9*16);
		$('.bgwrapper').css( "background-size", "bg_w_res bg_h_res" );
		 };


этот скрипт решит мою проблему с адаптацией, если я все-таки смогу задать bg_w_res и bg_h_res

danik.js 17.01.2015 15:28

Цитата:

Сообщение от kroleternal
с ним не везде все хорошо

Вот лучше на словах объясни. Чет не хочется в коде разбираться.

kroleternal 17.01.2015 17:01

вот если на словах, то нужно чтобы в строке
$('#block').css( "background-size", "x y" );

я мог задать параметры x и y :)

поскольку на многих мобильных устройствах свойство cover работает коряво вопреки описанию, в частности бардак выходит на айфонах. сейчас используется подгон кода посредством -webkit-min-device-pixel-ratio и прочих неблагозвучностей, и такой вариант адаптации я не считаю оптимальным. поэтому и нужен мой скрипт в работоспособном виде, это сведет адаптацию к минимально корявому коду.

danik.js 17.01.2015 17:21

Цитата:

Сообщение от kroleternal
я не считаю оптимальным

Такой "неоптимальный" в твоем понимании вариант будет гораздо оптимальнее верстки, работающей на jQuery (даже писать смешно) :D .

danik.js 17.01.2015 17:24

А где твой js код айфон учитывает? Вроде нет таких строк. Только какой-то хедер вычитывает. Это стоит делать через css. И вторую сторону по первой - но и это нахер не нужно, ибо css-значение auto сделает это за тебя.

kroleternal 17.01.2015 17:43

Цитата:

Сообщение от danik.js
А где твой js код айфон учитывает?

на данный момент адаптация прописана как раз через css. в js этого нет

Цитата:

Сообщение от danik.js
будет гораздо оптимальнее верстки, работающей на jQuery

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

Цитата:

Сообщение от danik.js
но и это нахер не нужно, ибо css-значение auto сделает это за тебя.

сделало бы если бы. не от хорошей жизни же я начал извращаться вместо того чтобы проставить 100% auto.

спасибо за комментарии, но основной вопрос вы обходите десятой дорогой. параметры в background-size - можно или нельзя?можно - как? нельзя - почему?

danik.js 17.01.2015 17:49

Цитата:

Сообщение от kroleternal
сделало бы если бы

Что ты хочешь этим сказать?

<style>
div{
height: 50px;
background: url(http://javascript.ru/forum/images/smilies/blink.gif) no-repeat center;
}
.div1{
background-size: 50px auto;
}
.div2{
background-size: auto 50px;
}
</style>
<div class="div1"></div>
<div class="div2"></div>


Хочешь сказать, что пропорции в этом примере не соблюдаются?

danik.js 17.01.2015 17:53

Цитата:

Сообщение от kroleternal
так что не так уж и смешно

Это не смешно. Это очень печально. Я на мобиле своей js отключил. За все время не встретил пока ни одного сайта со сломавшейся из-за этого верстки. Оказывается недалекие разработчики все-таки есть, просто я на их сайты еще не попадал.


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