Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » В помощь вебмастеру » Блок поиска, как скрыть половину блока

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 1 2

Открыть новую тему     Написать ответ в эту тему

Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Здравствуйте, есть блок фильтра поиска он длинный, хотелось бы часть блока оставить, а часть блока скрыть, и  сделать надпись, открыть полный поиск, при клике что бы весь блок поиска раскрывался.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 04:58 24-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
на jquery проще всего.. берете высоту блока, если больше, чем нужно, то "обрезаете".
простой пример  
http://jsfiddle.net/wyHEN/


----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 05:30 24-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Что то я там ничего не понял, мне бы пояснить что да как )))
как заключить в блоке ту часть которую нужно скрыть, а при клике на слово открыть весь поиск, будет открываться вся часть поиска, все фильтры.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 06:28 25-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
по ссылке работает так, как надо?  
 
нужно видеть о чем вообще идет речь для конкретики

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 06:40 25-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
я сделал, оно спрятало, а как сделать что бы оно раскрывалось )))
 
Добавлено:
у меня нет не какой кнопки раскрыть и т.д
вот тут я уже не понимаю что сделать надо.
 
Добавлено:
вот картинка:
http://s018.radikal.ru/i500/1310/95/a2c9fb1d67d2.jpg
 
я вставил скрипт и  стили.
урезало, но нет не какой кнопки что бы раскрывать меню.
 
там по идее целый список штук 30 галочек ставить можно, это фильтры для поиска.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 08:47 25-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
 но нет не какой кнопки что бы раскрывать меню.

блин.. вы серьезно считаете, что вам по картинке чем то помогут?
 
ссылка добавляется с помощью того же jquery кода.. но в чем особенность вашей структуры (так приведен пример в общем виде) - ну кто может об этом узнать по картинке??

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 09:03 25-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
кусок кода который нужно сократить
 

Код:
 
<div class="small">
                <div style="margin-left:-3px;">
                    <input type="checkbox" class="chekk" name="s['classic_sex']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['minet_in_condom']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['anal_sex']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['group_sex']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['lesbian_sex']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['minet_withot_condom']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['deep_minet']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['cunnilingus']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['sixty_nine']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['role_games']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['toys']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['for_couple']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['finish_in_mouth']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['finish_on_bust']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['finish_on_face']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['minet_in_car']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['escort']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['striptease']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['striptease_beginer']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['lesbo_show']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_erotic']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_relax']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_classic']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_pro']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_tai']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_uro']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['massage_points']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['domination']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['fetish']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['bandage']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['mistress']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['slave']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['flogging']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['trampling']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['face_sitting']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['strappon']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['analingus']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['gold_rain_get']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['gold_rain_put']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['fisting_anal']" >&nbsp;&nbsp;<span>------------------</span><Br>
                    <input type="checkbox" class="chekk" name="s['fisting_classic']" >&nbsp;&nbsp;<span>------------------</span><Br>
                </div></div>
 

 
я его обвернул в див смаал, он сократил его, но  нет  ссылки что бы развернуть.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 11:13 25-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
ну так там же не только css код нужен, а еще и javascript код.
в нем то и происходит автоматическое присвоение класса уменьшения, если высота больше предела. и добавление ссылки на открытие. и убирание этого класса при нажатии на ссылку.

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 11:17 25-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
я вставил js перед див.
 

Код:
 
            <script>
$(document).ready(function() {
    $('div').each(function() {
        var el = $(this);
        if (el.height() > 100) {
           el.addClass('small');
           $('<div class="read-more"/>').text('Прочитать далее').insertAfter(el);
        }
    });
    $('.read-more').click(function() {
       $(this).prev().removeClass('small');
       $(this).hide();
    });
});
</script>
<div class="small">
                <div style="margin-left:-3px;">  
и ...............................
...............................
..............
 

 
 
Добавлено:
я так понял что метод этот не работает, какой ни будь другой посоветуйте.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 11:43 25-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
все работает, нужно лишь думать что делаете и для чего.
я еще раз повторю - метод был приведен как пример.  
селектор $('div') выбирает все дивы, а вам нужен один или только определенные.
 

Цитата:
<div class="small">

класс скриптом добавлялся если высота была выше, чем нужно.
если вам нужно с конкретным divов и хотите сразу этот класс присваивать, то  
 
$(document).ready(function() {  
    $('.small').each(function() {  
           $('<div class="read-more"/>').text('Прочитать далее').insertAfter($(this));  
    });  
    $('.read-more').click(function() {  
       $(this).prev().removeClass('small');  
       $(this).hide();  
    });  
});  
 
вот так, к примеру.

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 21:44 25-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
вставил и то же самое,  у меня нет кнопки раскрыть весь фильтр поиска.
 
Добавлено:
советчик два бала тебе
 

Код:
 
<script>
window.onload= function() {
document.getElementById('toggler').onclick = function() {
openbox('box', this);
return false;
};
};
function openbox(id, toggler) {
var div = document.getElementById(id);
if(div.style.display == 'block') {
div.style.display = 'none';
toggler.innerHTML = 'Открыть';
}
else {
div.style.display = 'block';
toggler.innerHTML = 'Закрыть';
}
}  
</script>
 

 
<a id="toggler" href="#">Открыть</a>
 
<div id="box" style="display: none;">блок который скрыть</div>

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 03:49 26-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
советчик два бала тебе  

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

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 04:28 26-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
большое спасибо, просто вы меня наверное не правильно поняли.
 
у меня все таки есть делема:
 
скрипт:

Код:
 
<script>
window.onload= function() {
document.getElementById('toggler').onclick = function() {
openbox('box', this);
return false;
};
};
function openbox(id, toggler) {
var div = document.getElementById(id);
if(div.style.display == 'block') {
div.style.display = 'none';
toggler.innerHTML = 'Открыть';
}
else {
div.style.display = 'block';
toggler.innerHTML = '';
}
}  
</script>
 

 
мешает скрипту фото, когда на сайте кликаешь на фото то оно открывается в всплывающем окне.
 
как мне сделать что бы скрипт не мешал ??? что бы они не пересикались.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 08:03 27-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
как мне сделать что бы скрипт не мешал ??? что бы они не пересикались.

видимо не использовать

Цитата:
window.onload= function() {  

потому что это переписывает функцию onload, которая может быть использована скриптом фотографий.
 
если писать, то сохраняя старый обработчик и вызывая его тоже
 

Код:
var oldFun = window.onload;
window.onload= function() {
oldFun();  
document.getElementById('toggler').onclick = function() {  
openbox('box', this);  
return false;  
};  
};  

 
точнее сказать, не видя что происходит, нельзя

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 09:42 27-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
ну скорее всего так и есть, что одно другому мешает, а как вы увидите.
ну раз понятно что мешает фотографиям, как то можете переписать, что бы не мешало ?

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 10:42 27-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
 как то можете переписать, что бы не мешало

для того, чтобы понять, что мешает, надо видеть страницу в действии (то есть ссылка)


----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 12:14 27-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
там для того что бы фото добавить, нужно делать регистрацию.
 
Добавлено:
скинул в личку сайт

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 12:30 27-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu
для начала - исправить  

Цитата:
Uncaught TypeError: Cannot call method 'addEventListener' of undefined  ajax.js:37

из за нее прекращается дальнейшее выполнение js кода
 
далее.. вы же используете jQuery, зачем вам чистый javascript, если с ним больше писать кода для реализации разных вещей
 
ну и LightBox так и делает

Цитата:
function addLoadEvent(func)
{
    var oldonload = window.onload;
    if (typeof window.onload != 'function'){
        window.onload = func;
    } else {
        window.onload = function(){
            oldonload();
            func();
        }
    }
 
}

 
своим кодом, после этого, вы "убиваете" функцию запускающуюся по window.onload
как исправить - я уже написал, либо аналогично цитируемому куску

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 21:54 27-10-2013
Botovskiu

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
я вас не понял
если вставить без <script> код </script>  
работать не будет.
 
вы можете исправить как надо и выслать мне, я вообще не шарю в js
 
 
не работает этот код

Код:
 
function addLoadEvent(func)
{
    var oldonload = window.onload;
    if (typeof window.onload != 'function'){
        window.onload = func;
    } else {
        window.onload = function(){
            oldonload();
            func();
        }
    }
 
}  
 

 
Uncaught TypeError: Cannot call method 'addEventListener' of undefined  ajax.js:37
открыл: ajax.js и строка 37
там нет эрроров, я через дреам вивер, он пишет если есть ошибка.

Всего записей: 124 | Зарегистр. 20-10-2011 | Отправлено: 04:38 28-10-2013
Cheery



.:МордератоР:.
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Botovskiu

Цитата:
я вообще не шарю в js  

ну так найдите того, кто разбирается и кому можете дать доступ.
 

Цитата:
там нет эрроров, я через дреам вивер, он пишет если есть ошибка.

это не ошибка синтаксиса, а ошибка выполнения.
возникает в случае, к примеру, obj.addEventListener, но если obj не определен и не является объектом (об этом ошибка и говорит)
 

Цитата:
не работает этот код  

я же сказал "наподобие". он относится к вашему коду, его выполнению.
 
вместо
Код:
window.onload= function() {  
document.getElementById('toggler').onclick = function() {  
openbox('box', this);  
return false;  
};  
};

пишете

Код:
 
var oldFun = window.onload;  
window.onload= function() {  
if (typeof oldFun == 'function') oldFun();  
document.getElementById('toggler').onclick = function() {  
openbox('box', this);  
return false;  
};  
};  

 
ps: и вообще это все не нужно.  
разместите  

Код:
document.getElementById('toggler').onclick = function() {  
openbox('box', this);  
return false;  
};

в коде страницы ниже элемента с id='toggler'
тогда не нужно будет ничего придумывать с помощью window.onload, так как элемент уже будет существовать.
 
а через jQuery делается еще проще.

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 05:07 28-10-2013 | Исправлено: Cheery, 05:14 28-10-2013
Открыть новую тему     Написать ответ в эту тему

Страницы: 1 2

Компьютерный форум Ru.Board » Интернет » В помощь вебмастеру » Блок поиска, как скрыть половину блока


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru