• Страница 1 из 1
  • 1
Выручайте с внешним видом
boxroman Оффлайн
Проверенный
2
Дата: Вторник, 2014-11-04, 12:42 | Сообщение # 1
Привет всем взял отсюда вид для FAQ: http://infoscript.ru/news....20-3906

Ну для моего FAQ не подходит так как общирные темы (Не вмешаются).

в CSS не разобрался!

САЙТ с FAQ где в в CSS что изменить....

Выручайте!
Профиль
DarkDeveloper Оффлайн
Проверенный
2
Дата: Вторник, 2014-11-04, 18:22 | Сообщение # 2
Попробуй изменить свойство height в CSS
Код
.accordion :target h2 + div {height: 100px;}
на более высокие значения.
Профиль
boxroman Оффлайн
Проверенный
2
Дата: Вторник, 2014-11-25, 08:20 | Сообщение # 3
Я тут внешний вид изменил хотелось бы так что бы

Вот вопросы нажимая на них снизу открывался ответ а так всё скрыто было!

P.S:кто поможет в долгу не останусь подкину денжат!

Добавлено (25.11.2014, 08:20)
---------------------------------------------
ну так что ? есть идеи?

Профиль
robertbat123 Оффлайн
Проверенный
5
Дата: Среда, 2014-11-26, 13:34 | Сообщение # 4
Можно так:

Код
<a onclick="$('#otvet').slideToggle('slow');" href="javascript://">
Здесь вопрос
</a>
<div id="otvet" style="display:none;">
Здесь ответ
</div>

Если я конешно правильно понял.


Сообщение отредактировал robertbat123 - Среда, 2014-11-26, 13:37
Профиль
Вовчик Оффлайн
Проверенный
26
Дата: Четверг, 2014-11-27, 09:50 | Сообщение # 5
html
Код
       <div class="container">
          
             <div class="box">
                 <h2>
                     Toggle (переключатель)
                     <span class="l"></span><span class="r"></span>
                 </h2>
                 <div class="hide"><span class="s">Show</span><span class="h">Hide</span></div>
                 <div class="block">
                     <div class="block_in">
                    Контент 1
                     </div>
                 </div>
             </div>
              
             <div class="box closed">
                 <h2>
                     Toggle (переключатель)
                     <span class="l"></span><span class="r"></span>
                 </h2>
                 <div class="hide"><span class="s">Show</span><span class="h">Hide</span></div>
                 <div class="block">
                     <div class="block_in">
                            Контент 2
                     </div>
                 </div>
             </div>


css
Код
.box {
     background:#fff;
     margin-bottom:20px;
     padding:0;
     position: relative;
     overflow: hidden;
     border: 1px solid #ccc;
     border-radius: 5px;
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
     -webkit-box-shadow:0 0 10px #DCDCDC inset;
     -moz-box-shadow:0 0 10px #DCDCDC inset;
     box-shadow:0 0 10px #DCDCDC inset;
}
.box h2 {
     font-size:1em;
     font-weight:700;
     text-transform:uppercase;
     color:#444;
     background: #ddd;
     margin:0 -10px -1px -10px;
     padding:12px;
     padding-left: 15px;
     padding-right: 45px;
     -webkit-box-shadow:0 0 10px #DCDCDC inset;
     -moz-box-shadow:0 0 10px #DCDCDC inset;
     box-shadow:0 0 10px #DCDCDC inset;
     border-radius: 5px 5px 0 0;
     -moz-border-radius: 5px 5px 0 0;
     -webkit-border-radius: 5px 5px 0 0;
}

.block {
     padding:0;
}

.block_in {
     padding:12px;
}

.box div.hide {
display: block;
width: 40px;
line-height: 24px;
position: absolute;
right: 5px;
top: 8px;
cursor: pointer;
font-size: 10px;
text-transform: uppercase;
text-align: center;
border: solid 1px #aaa;
background: #f5f5f5;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-box-shadow:0 0 4px #DCDCDC inset;
-moz-box-shadow:0 0 4px #DCDCDC inset;
box-shadow:0 0 4px #DCDCDC inset;
}

.box div.hide:hover {
background: #fff;
}

.box div.hide span.h {    display: block;}
.box div.hide span.s {    display: none;}
.box div.show  span.h {    display: none;}
.box div.show  span.s {    display: block;}

.closed div.hide span.h {    display: none;}
.closed div.hide span.s {    display: block;}
.closed div.show  span.h {    display: block;}
.closed div.show  span.s {    display: none;}


js
Код
$(".box .block").show();
             $(".closed .block").hide();

             $("div.hide").click(function(){
                 $(this).toggleClass("show").next().slideToggle("medium");
             });


гуляю на Webo4ka.Ru:)
Профиль
  • Страница 1 из 1
  • 1
Поиск: