Общие вопросы по оформлению (64)

Поделиться1Пн, 21 Май 2018 19:56:21

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11882
Последний визит:
Вчера 20:39:23

Предыдущая тема: Общие вопросы по оформлению (63)


Инструменты для поиска и редактирования стиля (скриптов).	Как с помощью браузера можно определить элемент дизайна.
Каталог скриптов/CSS	Полезные скрипты, необходимые темы для новичков, а также ссылки на сайты рассказывающие что такое HTML и CSS.
Типовые Вопросы (ЧаВо)	Ответы на часто задаваемые вопросы.
Как задавать вопросы! Разница между стилем и скриптом. ( Советы)	Плюс к названию темы еще и Памятка.

Любой вопрос по оформлению/неполадкам сопровождайте ссылкой на форум, по которому возникли сложности.

Отредактировано Deff (Вт, 5 Июн 2018 18:07:41)

+1

Поделиться721Сб, 1 Дек 2018 16:35:35

Автор: Северный Ветер
Заслуженный
Зарегистрирован: Пн, 26 Сен 2011
Сообщений: 257
Уважение: +24
Позитив: +9
Последний визит:
Пт, 9 Апр 2021 02:21:30

Deff
~~Но, наверное, один все-таки не разберусь. Бошка трещит.~~
Отбой. Оказался умнее, чем я думал. Спасибо)

Отредактировано Северный Ветер (Сб, 1 Дек 2018 16:46:28)

+1

Поделиться722Сб, 1 Дек 2018 20:44:06

Автор: Mirra Bell
Модератор
Зарегистрирован: Чт, 3 Апр 2014
Сообщений: 2184
Уважение: +1880
Позитив: +2475
Пол: Женский
Последний визит:
Ср, 13 Ноя 2024 09:02:28

Нашла в каталоге скрипт оформления подсказок в ссылках в постах. А как оформить всплывающие подсказки (хинты) title не в постах?

0

Поделиться723Сб, 1 Дек 2018 20:57:17

Автор: Неспетый
Заслуженный
Зарегистрирован: Вс, 5 Июл 2015
Сообщений: 148
Уважение: +28
Позитив: +47
Последний визит:
Ср, 26 Авг 2020 00:50:55

Mirra Bell
Смотря о каких подсказках идёт речь, ну на первый взгляд их можно оформить через ::after / ::before

0

Поделиться724Сб, 1 Дек 2018 21:02:19

Автор: Mirra Bell
Модератор
Зарегистрирован: Чт, 3 Апр 2014
Сообщений: 2184
Уважение: +1880
Позитив: +2475
Пол: Женский
Последний визит:
Ср, 13 Ноя 2024 09:02:28

Неспетый написал(а):

Смотря о каких подсказках идёт речь

Например о всплывающем тексте при наведении на картинку

0

Поделиться725Сб, 1 Дек 2018 21:47:10

Автор: Неспетый
Заслуженный
Зарегистрирован: Вс, 5 Июл 2015
Сообщений: 148
Уважение: +28
Позитив: +47
Последний визит:
Ср, 26 Авг 2020 00:50:55

Mirra Bell
Вот смотри https://www.w3schools.com/css/css_tooltip.asp
Только вместо tittle что-то другое надо будет писать, иначе будут две подсказки сразу показываться (системные и свои). Хотя если написать скрипт, тогда проблем не будет, но зачем?

Отредактировано Неспетый (Сб, 1 Дек 2018 21:47:35)

0

Поделиться726Вс, 2 Дек 2018 00:42:22

Автор: Северный Ветер
Заслуженный
Зарегистрирован: Пн, 26 Сен 2011
Сообщений: 257
Уважение: +24
Позитив: +9
Последний визит:
Пт, 9 Апр 2021 02:21:30

Mirra Bell
Типа такого?

<a href="ссылка" target="_blank">
<img src="картинка" title="текст"></a>

0

Поделиться727Вс, 2 Дек 2018 00:53:22

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11882
Последний визит:
Вчера 20:39:23

Mirra Bell
Ну если стандартная, черная подойдёт, то сделайте скриншот, где нужны и ссылку на форум,... ну или есть нечерная на этом форуме => http://udomovogo.rusff.ru/viewforum.php?id=55

0

Поделиться728Вс, 2 Дек 2018 12:31:27

Автор: Mirra Bell
Модератор
Зарегистрирован: Чт, 3 Апр 2014
Сообщений: 2184
Уважение: +1880
Позитив: +2475
Пол: Женский
Последний визит:
Ср, 13 Ноя 2024 09:02:28

Речь вот о чем: у меня есть картинки, к которым прописан title, как написал Северный Ветер. При этом выглядит это так

Вопрос: как можно управлять атрибутами этой подсказки? Мне нужны цвет фона, размер и цвет шрифта и т.д. Форум http://overside.rolbb.ru/

Отредактировано Mirra Bell (Вс, 2 Дек 2018 12:31:51)

0

Поделиться729Вс, 2 Дек 2018 12:41:14

Автор: Северный Ветер
Заслуженный
Зарегистрирован: Пн, 26 Сен 2011
Сообщений: 257
Уважение: +24
Позитив: +9
Последний визит:
Пт, 9 Апр 2021 02:21:30

Mirra Bell
Подозреваю, вы говорите об этом.

Код:

#tooltip {
....
}

Между скобками можно вставлять все, что угодно: цвет фона, цвет текста, оформление границы, написание текста, свой шрифт...

0

Поделиться730Вс, 2 Дек 2018 12:42:23

Автор: Mirra Bell
Модератор
Зарегистрирован: Чт, 3 Апр 2014
Сообщений: 2184
Уважение: +1880
Позитив: +2475
Пол: Женский
Последний визит:
Ср, 13 Ноя 2024 09:02:28

Северный Ветер
Т.е. в CSS описать такой класс с заданными свойствами и потом его указать? Или хинты его подхватят по умолчанию?

Отредактировано Mirra Bell (Вс, 2 Дек 2018 12:43:15)

0

Поделиться731Вс, 2 Дек 2018 13:42:18

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11882
Последний визит:
Вчера 20:39:23

Mirra Bell написал(а):

Речь вот о чем: у меня есть картинки, к которым прописан title, как написал Северный Ветер. При этом выглядит это так

Вопрос: как можно управлять атрибутами этой подсказки? Мне нужны цвет фона, размер и цвет шрифта и т.д. Форум http://overside.rolbb.ru/

ставите ниже скрипта инфо таблы такой код:

<script type="text/javascript">$('#TableInfo [title]').css({'display':'inline-block'}).tipsy({live:true,fade: true, gravity: 'w tableInfo'});</script>

Варианты всплывания меняются от параметра красным:
nw | n | ne | w | e | sw | s | se

===========================================

HTML самой подсказки формируемой этим скриптом:

<div class="tipsy tipsy-w tableInfo" >
<div class="tipsy-arrow"/>
<div class="tipsy-inner">Переодеться</div>
</div>

Размер шрифта можно через Свой Стиль установить наверно так:

.tipsy.tableInfo tipsy-inner {
font-size: 11px!important;
}

(ну и все остальные параметры, смотря на выше реальный HTML код подсказки)

Отредактировано Deff (Вс, 2 Дек 2018 13:50:19)

+3

Поделиться732Вс, 2 Дек 2018 18:47:55

Автор: Sanarami
Заслуженный
Зарегистрирован: Вт, 16 Сен 2014
Сообщений: 79
Уважение: +16
Позитив: +44
Пол: Женский
Последний визит:
Вс, 10 Ноя 2024 16:39:11

Добра, уважаемые!
Не даёт мне покоя косяк в нижней части форума.
Здесь, на форуме тех. поддержки, расположение нижнего колонтитула адекватное.

вид из темы

вид на главной

У меня же явно не на своём месте стоит. Плюс кнопки предпросмотра и ответа "приклеились" к картинке футера (это уже новый прикол после смены дизайна).

скрин с моего форума

Deff поделился костыликом, который помогает решать проблему колонтитула.

лечилка в верхнем окне стилей

/*Нижний колонтитул темы*/
#pun-crumbs2{
height: 64px;
}
#pun-crumbs2 .crumbs{
position:relative; z-index:100;
display:inline-block;
margin-top:-8px!important;
margin-left: 130px!important;
text-shadow: 0 0 1px rgba(39,49,23,.7);
color:#554836;
}

Но очевидно же, что всё равно не на своём месте эта строка. Как её настроить, чтобы без доп.лечилок корректное местоположение заняла?
Форум: http://mistsofboston.rusff.ru/

Отредактировано Sanarami (Вс, 2 Дек 2018 21:28:15)

0

Поделиться733Вс, 2 Дек 2018 18:49:52

Автор: Riya
Заслуженный
Зарегистрирован: Вс, 5 Июл 2009
Сообщений: 301
Уважение: +187
Позитив: +666
Пол: Женский
Последний визит:
Вчера 17:34:50

День добрый. Поставили новый дизайн.
Стоит скрипт "Своя картинка в категорию" и стрелки вверх-вниз.
С мобильного картинки со стрелками "залезают" под картинки с категориями.

В категориях z-index регулировала, не помогло. Куда этот z-index в "стрелках" впихивать, не разобралась.
Как можно поправить?
Форум

0

Поделиться734Вс, 2 Дек 2018 18:59:10

Автор: kolobdur74
...
Зарегистрирован: Пн, 6 Сен 2010
Сообщений: 7390
Уважение: +5876
Позитив: +6482
Пол: Мужской
Последний визит:
Чт, 21 Ноя 2024 21:12:40

Riya написал(а):

В категориях z-index регулировала, не помогло. Куда этот z-index в "стрелках" впихивать, не разобралась.

Сюда:

<a style="position: fixed; top: 500px; right: 73px; cursor: pointer; background-color: transparent !important;z-index:1000;" id="Go_Top"><img src="http://forumstatic.ru/files/0017/c5/01/94517.png" alt="Вверх"></a>
<a style="position: fixed; top: 560px; right: 103px; cursor: pointer; background-color: transparent !important;z-index:1000;" id="Go_Bottom"><img src="http://forumstatic.ru/files/0017/c5/01/80952.png" alt="Вниз"></a>
<script type="text/javascript">
jQuery(function(){
$("#Go_Top").hide().removeAttr("href");
if ($(window).scrollTop()>="250") $("#Go_Top").fadeIn("slow")
$(window).scroll(function(){
if ($(window).scrollTop()<="250") $("#Go_Top").fadeOut("slow")
else $("#Go_Top").fadeIn("slow")
});
$("#Go_Bottom").hide().removeAttr("href");
if ($(window).scrollTop()<=$(document).height()-"999") $("#Go_Bottom").fadeIn("slow")
$(window).scroll(function(){
if ($(window).scrollTop()>=$(document).height()-"999") $("#Go_Bottom").fadeOut("slow")
else $("#Go_Bottom").fadeIn("slow")
});
$("#Go_Top").click(function(){
$("html, body").animate({scrollTop:0},"slow")
})
$("#Go_Bottom").click(function(){
$("html, body").animate({scrollTop:$(document).height()},"slow")
})
});
</script>

+1

Поделиться735Вс, 2 Дек 2018 19:10:44

Автор: Riya
Заслуженный
Зарегистрирован: Вс, 5 Июл 2009
Сообщений: 301
Уважение: +187
Позитив: +666
Пол: Женский
Последний визит:
Вчера 17:34:50

kolobdur74
спасибо большое.

+1

Поделиться736Вс, 2 Дек 2018 20:29:11

Автор: kolobdur74
...
Зарегистрирован: Пн, 6 Сен 2010
Сообщений: 7390
Уважение: +5876
Позитив: +6482
Пол: Мужской
Последний визит:
Чт, 21 Ноя 2024 21:12:40

Sanarami написал(а):

Но очевидно же, что всё равно не на своём месте эта строка. Как её настроить, чтобы без доп.лечилок корректное местоположение заняла?

Попробуйте добавить:

/* CS2.2 */
.punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info,
.punbb .category, .punbb .post {
border-style: none;
border-width: 0;
padding-bottom: 50px;
}

+1

Поделиться737Вс, 2 Дек 2018 21:27:14

Автор: Sanarami
Заслуженный
Зарегистрирован: Вт, 16 Сен 2014
Сообщений: 79
Уважение: +16
Позитив: +44
Пол: Женский
Последний визит:
Вс, 10 Ноя 2024 16:39:11

kolobdur74, не помогает. Вставляет куски "тела" форума в самом верху и в нижней части.
Если нужно и упростит задачу по отлову косяка, могу дать админские доступы.

Отредактировано Sanarami (Вс, 2 Дек 2018 21:29:24)

0

Поделиться738Вс, 2 Дек 2018 21:31:40

Автор: kolobdur74
...
Зарегистрирован: Пн, 6 Сен 2010
Сообщений: 7390
Уважение: +5876
Позитив: +6482
Пол: Мужской
Последний визит:
Чт, 21 Ноя 2024 21:12:40

kolobdur74 написал(а):

Попробуйте добавить:

Sanarami написал(а):

не помогает. Вставляет куски "тела" форума в самом верху и в нижней части.
Если нужно и упростит задачу по отлову косяка, могу дать админские доступы.

Неправильно показал.. Вот сюда попробуйте добавить:

/* D8.6 где находишься, низ */
#pun-crumbs2 {
font-weight: normal;
overflow: hidden;
margin-bottom: 0;
border-bottom: none;
font-family: 'cuprum';
text-align: left;
letter-spacing: 0.5px;
font-size:12px;
font-style: none;
padding-bottom: 50px;
}

Или если будет косячить на главной странице, то просто добавьте:

Код:

#pun-viewtopic #pun-crumbs2 {padding-bottom: 50px;}

Так: font-style: none; не бывает, бывает так: normal | italic | oblique | inherit, подробнее: http://htmlbook.ru/css/font-style

Отредактировано kolobdur74 (Вс, 2 Дек 2018 21:35:12)

+1

Поделиться739Вс, 2 Дек 2018 22:01:24

Автор: Sanarami
Заслуженный
Зарегистрирован: Вт, 16 Сен 2014
Сообщений: 79
Уважение: +16
Позитив: +44
Пол: Женский
Последний визит:
Вс, 10 Ноя 2024 16:39:11

kolobdur74, уже вижу изменения, похожие на действительность.
Убрала костыль Дефа из css, поставила стайлу "нормал" (каюсь, в основах нередко косячу, уповая на авось), колонтитул почти там, где он должен быть.
Посмотрите ещё раз, пожалуйста.

Увеличила паддинг и в общем-то,что "загуляло", то теперь на месте.
kolobdur74, большое спасибо за указание направления.

Отредактировано Sanarami (Вс, 2 Дек 2018 22:42:33)

+1

Поделиться740Вс, 2 Дек 2018 22:49:13

Автор: kolobdur74
...
Зарегистрирован: Пн, 6 Сен 2010
Сообщений: 7390
Уважение: +5876
Позитив: +6482
Пол: Мужской
Последний визит:
Чт, 21 Ноя 2024 21:12:40

Sanarami написал(а):

Увеличила паддинг и в общем-то,что "загуляло", то теперь на месте.

Можно и до 80 пикселей увеличить..

+1

Единый форум поддержки

Меню навигации

Пользовательские ссылки

Информация о пользователе

Общие вопросы по оформлению (64)

Сообщений 721 страница 740 из 1000

Поделиться1Пн, 21 Май 2018 19:56:21

Поделиться721Сб, 1 Дек 2018 16:35:35

Поделиться722Сб, 1 Дек 2018 20:44:06

Поделиться723Сб, 1 Дек 2018 20:57:17

Поделиться724Сб, 1 Дек 2018 21:02:19

Поделиться725Сб, 1 Дек 2018 21:47:10

Поделиться726Вс, 2 Дек 2018 00:42:22

Поделиться727Вс, 2 Дек 2018 00:53:22

Поделиться728Вс, 2 Дек 2018 12:31:27

Поделиться729Вс, 2 Дек 2018 12:41:14

Поделиться730Вс, 2 Дек 2018 12:42:23

Поделиться731Вс, 2 Дек 2018 13:42:18

Поделиться732Вс, 2 Дек 2018 18:47:55

Поделиться733Вс, 2 Дек 2018 18:49:52

Поделиться734Вс, 2 Дек 2018 18:59:10

Поделиться735Вс, 2 Дек 2018 19:10:44

Поделиться736Вс, 2 Дек 2018 20:29:11

Поделиться737Вс, 2 Дек 2018 21:27:14

Поделиться738Вс, 2 Дек 2018 21:31:40

Поделиться739Вс, 2 Дек 2018 22:01:24

Поделиться740Вс, 2 Дек 2018 22:49:13