lyamon4ik Опубликовано 16 января, 2013 Поделиться Опубликовано 16 января, 2013 Здравствуйте, Можно как нибудь из стиля Uniform для IP.Board 3.3.x отдельно взять функцию смены фона и сделать её на стиле Velvet? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
_Dark_ Опубликовано 16 января, 2013 Поделиться Опубликовано 16 января, 2013 Вообще можно. Если никто не ответит, завтра вечером напишу по этому поводу. lyamon4ik 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
lyamon4ik Опубликовано 16 января, 2013 Автор Поделиться Опубликовано 16 января, 2013 Спасибо огромное!!! Буду ждать! Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Respected Опубликовано 17 января, 2013 Поделиться Опубликовано 17 января, 2013 1) Изображения из папки back кидаем в папку с изображениями стиля 2) Папку js кидаем в папку с изображениями стиля 3) Создаём новый css с названием: custom_backgrounds и добавляем в него: body.bg1{ background-color: #000; background-image: url('{style_images_url}/background1.jpg'); background-repeat: no-repeat; } body.bg2{ background-color: #000; background-image: url('{style_images_url}/background2.jpg'); background-repeat: no-repeat; } body.bg3{ background-color: #000; background-image: url('{style_images_url}/background3.jpg'); background-repeat: no-repeat; } body.bg4{ background-color: #000; background-image: url('{style_images_url}/background4.jpg'); background-repeat: no-repeat;} body.bg5{ background-color: #000; background-image: url('{style_images_url}/background5.jpg'); background-repeat: no-repeat;} body.bg6{ background-color: #000; background-image: url('{style_images_url}/background6.jpg'); background-repeat: no-repeat; } body.bg_custom{ background-color: #fff; } 4) В самый низ ipb_styles.css добавляем: #nav_background{ /*cursor: pointer; padding: 0 2px;*/ float: right; margin-top: 7px; list-style: none; padding-left: 2px; } #custom_background span{ display: block; float: left; width: 145px; height: 90px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: inset rgba(0,0,0,1) 0px 1px 7px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; -moz-box-shadow: inset rgba(0,0,0,1) 0px 1px 7px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; box-shadow: inset rgba(0,0,0,1) 0px 1px 7px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; margin-right: 15px; cursor: pointer; background: #000 no-repeat 50% 50%; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } #custom_background span:hover{ -webkit-box-shadow: inset rgba(0,0,0,1) 0px 1px 2px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; -moz-box-shadow: inset rgba(0,0,0,1) 0px 1px 2px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; box-shadow: inset rgba(0,0,0,1) 0px 1px 2px, rgba(255,255,255,0.05) 0px 1px 0px, rgba(255,255,255,0.35) 0px 0px 1px; } #custom_url{ clear: left; padding-top: 10px; text-align: center; } #custom_input{ background: url("{style_images_url}/trans50.png") repeat; background: rgba(0,0,0,0.5); border: 0; -webkit-box-shadow: inset rgba(0,0,0,0.75) 0px 1px 3px, rgba(255,255,255,0.15) 0px 1px 0px; -moz-box-shadow: inset rgba(0,0,0,0.75) 0px 1px 3px, rgba(255,255,255,0.15) 0px 1px 0px; box-shadow: inset rgba(0,0,0,0.75) 0px 1px 3px, rgba(255,255,255,0.15) 0px 1px 0px; padding: 0 10px; font-size: 20px; line-height: 40px; height: 40px; width: 780px; color: #fff; white-space: nowrap; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-right: 8px; } #custom_submit{ line-height: 40px; font-size: 20px; display: inline-block; font-weight: normal; color: #fff; cursor: pointer; background: #686c73 url("{style_images_url}/highlight.png") repeat-x 0 0; text-shadow: #4c5057 0px -1px 0px; -webkit-box-shadow: rgba(0,0,0,0.6) 0px 1px 3px; -moz-box-shadow: rgba(0,0,0,0.6) 0px 1px 3px; box-shadow: rgba(0,0,0,0.6) 0px 1px 3px; padding: 0 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } #custom_submit:hover{ background-color: #898f96; } #toggle_background{ display: none; } #custom_background { color: #fff; background: #fff url("{style_images_url}/slide_bg.jpg") repeat; position: relative; padding: 15px; -webkit-box-shadow: inset rgba(0,0,0,0.8) 0px 0px 10px; -moz-box-shadow: inset rgba(0,0,0,0.8) 0px 0px 10px; box-shadow: inset rgba(0,0,0,0.8) 0px 0px 10px; } #custom_background{ padding-right: 0; overflow: hidden; } 5) Редактируем globalTemplate Найти: {parse template="includeJS" group="global" params="$jsModules"} Добавить выше: <script type='text/javascript'>!window.jQuery && document.write('<script src="{style_images_url}/js/jquery.min.js"></script>')</script> <script type='text/javascript' src="{style_images_url}/js/cookie.js"></script> <script type='text/javascript' src="{style_images_url}/js/ipbforumskins.js"></script> Найти: <body id='ipboard_body'> Заменить на: <body data-customBackground='enabled' id='ipboard_body'> Найти: <if test="canSearch:|:$this->memberData['g_use_search']"> {parse template="quickSearch" group="global" params=""} </if> Ниже добавить: <li id='nav_background' data-tooltip="Change background image"><a href="#"><img src='{style_images_url}/nav_background.png' alt='' /></a></li> <div id='toggle_background'><div id='custom_background'> <span id='bg1' style='background-image: url({style_images_url}/background1_thumb.jpg);'></span> <span id='bg6' style='background-image: url({style_images_url}/background6_thumb.jpg);'></span> <span id='bg5' style='background-image: url({style_images_url}/background5_thumb.jpg);'></span> <span id='bg2' style='background-image: url({style_images_url}/background2_thumb.jpg);'></span> <span id='bg3' style='background-image: url({style_images_url}/background3_thumb.jpg);'></span> <span id='bg4' style='background-image: url({style_images_url}/background4_thumb.jpg);'></span> <div id='custom_url'><input type='text' id='custom_input' placeholder="ИЛИ введите URL своего бэкграунда и нажмите Изменить" /><strong id='custom_submit'>Изменить</strong></div> </div></div><br /> Вроде всё js.rar backs.rar Юрьевич, Ded2, benix и 1 другой 4 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
lyamon4ik Опубликовано 18 января, 2013 Автор Поделиться Опубликовано 18 января, 2013 Привет, Respected спасибо огромное что помог! у меня к тебе один вопрос, на форуме не отображается картинка на которую нужно нажать чтоб выдвинулась окно окно где вводить url, но если удалить параметр <div id='toggle_background'> то он показывает окно где в водить url, по какой причини он может не отображать? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Respected Опубликовано 18 января, 2013 Поделиться Опубликовано 18 января, 2013 Всё таки забыл указать один код. Где нужна кнопка, добавить: <li id='nav_background' data-tooltip="Change background image"><a href="#"><img src='{style_images_url}/nav_background.png' alt='' /></a></li> benix и lyamon4ik 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
lyamon4ik Опубликовано 18 января, 2013 Автор Поделиться Опубликовано 18 января, 2013 Теперь всё работает норм) только когда нажимаешь на кнопку то выдвигается менюшка где можно ввести url, но она также быстро сома убирается назад) В чём причина?) Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
lyamon4ik Опубликовано 19 января, 2013 Автор Поделиться Опубликовано 19 января, 2013 С этой проблемой разобрался, я нечаянно подключил 2 раза <script type='text/javascript' src="{style_images_url}/js/ipbforumskins.js"></script> =) а вот как сделать чтобы картинку которую поставили по url растягивалась на весь экран? которые стандартные на выбор давались я проста в настройках сайта поставил параметр "fixed" Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Respected Опубликовано 19 января, 2013 Поделиться Опубликовано 19 января, 2013 За кастомный бэкграунд отвечает css: body.bg_custom{ background-color: #fff; } lyamon4ik и benix 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
benix Опубликовано 28 апреля, 2016 Поделиться Опубликовано 28 апреля, 2016 В 19.01.2013 в 11:47, Respected сказал: За кастомный бэкграунд отвечает css: body.bg_custom{ background-color: #fff; } Спасибо большое за инструкцию! Можешь перезалить архив js.rar, пожалуйста? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
benix Опубликовано 28 апреля, 2016 Поделиться Опубликовано 28 апреля, 2016 И еще вопрос, можно ли добавить в качестве фона картинку персонализацию пользователя? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.