Функция изменения параметров стиля

@Retyrn0 · Регистрация: 24.06.2013

Студворк — интернет-сервис помощи студентам

Доброго времени суток. Помогите разобраться. Что сейчас:

JavaScript
1
2
3
4
5
6
7
8
9
10
function EditStyle(ID,x,y,w,h,a,z)
{
   ID.style.position='absolute';
   ID.style.left      =x+'%';
   ID.style.top      =y+'%';
   ID.style.width   =w+'%';
   ID.style.height  =h+'%';
   ID.style.opacity =a/100;
   ID.style.filter     ='alpha(opacity='+a+')';
}

Скрипт должен быть кросс-браузерным, изменять параментры элемента ID:

x - отступ от левого края страницы в процентах
y - отступ от верхнего края страницы в процентах
w - ширина элемента
h - высота элемента
a - альфа - прозрачность
z - z-index.

Сейчас вроде работает прозрачность, x, y,w,h. Проблема с z-index пока что. Не пойму...строка

JavaScript
1
ID.style.z-index      =z;

не работает. Я новичёк - не судите, лучше помогите.

@Thisman · 25.07.2014, 11:05

Retyrn0,

JavaScript
1
2
//не el.style.z-index, a
el.style.zIndex = 9999;

@Retyrn0 · 25.07.2014, 11:11 **[ТС]**

Вызываю:

HTML5
1
<img id='img1' src='1.jpg' alt='image'></img>

JavaScript
1
EditStyle(document.getElementById('img1'),10,10,50,50,50,5);

Добавлено через 2 минуты

Сообщение от Thisman

1
2 //не el.style.z-index, a
el.style.zIndex = 9999;

Сообщение от Thisman

1
2 //не el.style.z-index, a
el.style.zIndex = 9999;

Спасибо!

Добавлено через 2 минуты
Ещё вопрос. Как делать то же самое с текстом? Т.е. не просто текст, а текст внутри прямоугольной области нужен. Я думаю это таблица 1х1? Или есть специальный тег какой - я не нашёл.

@Thisman · 25.07.2014, 11:12

Retyrn0, ну засунь его в див,или span ( вроде тоже блочный тег )

mixenik · 25.07.2014, 11:14

<div>Текст</div> со стилем border: 1px solid #цвет ?

Добавлено через 15 секунд
не успел=)

Добавлено через 22 секунды
span вроде inline-block

@Retyrn0 · 25.07.2014, 11:20 **[ТС]**

Сообщение от Thisman

ну засунь его в див

Пробовал. Там почему-то не срабатывает ширина и высота.

HTML5
1
<div id='text'>Привет!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!</div>

JavaScript
1
EditStyle(document.getElementById('img1'),0,0,5,5,100,5);

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

Добавлено через 55 секунд

Сообщение от mixenik

<div>Текст</div> со стилем border: 1px solid #цвет ?

Сейчас попробую, может с boder сработает.

mixenik · 25.07.2014, 11:22

отступ текста(pading) установить не забудь

Добавлено через 29 секунд
а вообще текст должен переноситься по словам

@Thisman · 25.07.2014, 11:23

Retyrn0, что именно ты хочешь? Что бы слишком длинное слово переносилось на другую строку ? У тебя изначально ширина дива равна ширине контента, поэтому в любом случае переноса не будет. Поставь ему ширину допустим 150px и пропиши word-wrap:wrap ( кажется так ) и все будет как тебе нужно

mixenik · 25.07.2014, 11:24

В дополнение почитай тут

@Retyrn0 · 25.07.2014, 11:30 **[ТС]**

Сообщение от Thisman

что именно ты хочешь

Чтобы текст не игнорировал параметр ширины...подскажите, может таблица из одной ячейки даст желаемый результат? Над таблицей же можно проделывать всё, что в функции? Да и картинку можно запихнуть - вообще круто)

Добавлено через 1 минуту
По принципу textarea, только менять нельзя.

mixenik · 25.07.2014, 11:30

div в этом плане лучше. Верстка таблицами устарела лет 10 назад

@Thisman · 25.07.2014, 11:33

Retyrn0, тоже самое можно и с дивом сделать

HTML5
1
<div style="width:150px;word-break: break-word;"></div>

Прости, перепутал название стилей( word-break: break-word;, вот так надо прописывать

@Retyrn0 · 25.07.2014, 11:38 **[ТС]**

Спасибо большое за соучастие, буду пробовать)

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Thisman Модератор 771 / 352 / 142 Регистрация: 17.07.2013 Сообщений: 992
	25.07.2014, 11:12
	Retyrn0, ну засунь его в див,или span ( вроде тоже блочный тег ) 0

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	25.07.2014, 11:14
	<div>Текст</div> со стилем border: 1px solid #цвет ? Добавлено через 15 секунд не успел=) Добавлено через 22 секунды span вроде inline-block 0

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	25.07.2014, 11:22
	отступ текста(pading) установить не забудь Добавлено через 29 секунд а вообще текст должен переноситься по словам 0

@Thisman Модератор 771 / 352 / 142 Регистрация: 17.07.2013 Сообщений: 992
	25.07.2014, 11:23
	Retyrn0, что именно ты хочешь? Что бы слишком длинное слово переносилось на другую строку ? У тебя изначально ширина дива равна ширине контента, поэтому в любом случае переноса не будет. Поставь ему ширину допустим 150px и пропиши word-wrap:wrap ( кажется так ) и все будет как тебе нужно 0

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	25.07.2014, 11:24
	В дополнение почитай тут 0

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	25.07.2014, 11:30
	div в этом плане лучше. Верстка таблицами устарела лет 10 назад 1

@Retyrn0 45 / 48 / 5 Регистрация: 24.06.2013 Сообщений: 677
	25.07.2014, 11:38 [ТС]
	Спасибо большое за соучастие, буду пробовать) 0