переключение div в группе с исчезновением

Question

переключение div в группе с исчезновением

0

Недавно мне было предложено выяснить, как дублировать функциональность, найденную на этом сайте:

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

С моей попыткой я собрал jsfiddle.

http://jsfiddle.net/zGaTM/

$(document).ready(function () {
    $('.the-team').click(
      function() {
        $('.social-info').hide();
        $(this).next('.social-info').addClass("showdetails");
    },

    function () {
        $(this).next('.social-info').addClass("hidedetails");
    });
});

user2983416 13 нояб. 2013, в 15:47

Источник

0

Я не вижу, что там что-то происходит при нажатии ...
CBroe 13 нояб. 2013, в 14:00
0

Я извиняюсь, я действительно новичок в jquery.
user2983416 13 нояб. 2013, в 14:10
0

Посмотрите на это, вы можете понять это. Скрипка Необходимо заблокировать событие наведения на изображении.
Ali Exalter 13 нояб. 2013, в 14:15
0

Но мне нужно, чтобы это было на событии щелчка, а не наведении курсора.
user2983416 13 нояб. 2013, в 14:29

Показать ещё 2 комментария

Теги:

jquery

toggle

fade

2 ответа

0

Я упростил то, что вы пытаетесь сделать: пример - Работает над примером Али Эксальтера

$(document).ready(function () {
    $('.teamCont').hover(
    function () {
        $(this).find("img").fadeTo("fast" , 0.1, function() { $(this).next('.social-info').show(); });
    },
    function () {
        $(this).find("img").fadeTo(100 , 1, function() { $(this).next('.social-info').hide(); }); 
    });
});

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

Frost 13 нояб. 2013, в 13:29

Ещё вопросы

Я не вижу, что там что-то происходит при нажатии ...
Я извиняюсь, я действительно новичок в jquery.
Посмотрите на это, вы можете понять это. Скрипка Необходимо заблокировать событие наведения на изображении.
Но мне нужно, чтобы это было на событии щелчка, а не наведении курсора.

Ali Exalter · Accepted Answer · 2013-11-13T12-05-00.000Z

Здесь я создаю его на jsfiddle Change hover, чтобы щелкнуть его.

    $(document).ready(function () {
    $('.the-team').click(  //click or hover
      function() {
          $('.social-info').hide();
          $(this).next('.social-info').show();
          $(this).next('.social-info').removeClass("hidedetails");
        $(this).next('.social-info').addClass("showdetails");
    });
});

Div.teamCont - основной контейнер в css put float: left; для выравнивания их по горизонтали. Если вы придаете непрозрачность основному контейнеру, он будет применяться к каждому ребенку внутри этого контейнера. Вместо этого, используя прозрачность, я предлагаю использовать прозрачный PNG файл в качестве фона div social-info. Он не будет исчезать над дочерними элементами. Или проверьте cSS сейчас на Final_JSfiddle. Пожалуйста, отметьте ответ.

в скрипке работает отлично! Кажется, это не работает хорошо, когда я пытаюсь сделать это локально. проверка моего кода Спасибо!