выделение следующего тега <dd>после нажатия на ссылку - PullRequest
Новая
       34

выделение следующего тега <dd>после нажатия на ссылку

0 голосов
/ 27 августа 2010

Я использую какой-то код, который нашел, чтобы выделить идентификатор после нажатия на ссылку привязки.

Я бы хотел изменить это, чтобы вместо этого выделить следующий тег <dd> в списке определений: 

<dl class="mainfaq">
      <dt id="q1">Q1</dt>
         <dd><p>A1</p></dd>
      <dt id="q2">Q2</dt>
         <dd><p>A2</p></dd>
      <dt id="q3">Q3</dt>
         <dd><p>A3</p></dd>
</dl>

Вот пример из Lincoln Loop 

    function highlight(elemId){
    var elem = $(elemId);
    elem.css("backgroundColor", "#ffffff"); // hack for Safari
    elem.animate({ backgroundColor: '#ffffaa' }, 1500);
    setTimeout(function(){$(elemId).animate({ backgroundColor: "#ffffff" }, 3000)},1000);
}

if (document.location.hash) {
    highlight(document.location.hash);
}
$('a[href*=#]').click(function(){
    var elemId = '#' + $(this).attr('href').split('#')[1];
    highlight(elemId);
});

Я не могу заставить работать обычные модификации .next или .sibling.

Ответы [ 2 ]

1 голос
/ 27 августа 2010

Я бы использовал n ext соседний селектор брата : 

highlight(elemId + ' + dd');
0 голосов
/ 27 августа 2010

Я не совсем уверен, чего вы пытаетесь достичь, но при условии, что вы нажимаете ссылку на той же странице, а затем пытаетесь выделить целевой элемент, вы можете использовать чистое решение CSS: 

:target + dd > p { /* css */ }

Он должен быть нацелен на p, который является прямым потомком dd, который является непосредственным братом элемента target -ed dt.

Однако есть некоторые предостережения в отношении этого подхода; Я не могу представить, что IE <8 (и, возможно, включая 8) будет реализовывать это должным образом. И почти наверняка потребуется действительный тип документа. </p>

Демонстрация на jsbin : http://jsbin.com/oqamu4

...