Stack Overflow на русском Asked by user385960 on February 11, 2021
есть спойлеры (штук 20), требуется через выпадающее меню select выбирать по названию требуемый спойлер, с последующим открытием и фокусом на него
CSS,HTML код прилагаю
css:
.horizontal-click [name="vkl"] { display: none; }
.horizontal-click > :not(input):not(label) {
overflow: hidden;
height: 0;
margin: 0;
padding: 0 .5em;
<!-- border: 1px solid #808080; -->
border-top-style: none;
transition: .5s;
}
.horizontal-click > label {
overflow: hidden;
display: block;
padding: .7em 1em;
background: #564BF4;
color: rgb(255, 255, 255);
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
border: 4px solid white;
}
.horizontal-click > :checked + label + * {
overflow: auto;
height: 250px;
}
.horizontal-click > :checked + label {
background: #F40000;
cursor: default;
}
html:
<input type="checkbox" name="vkl" id="vkl14"/><label for="vkl14">спойлер</label>
<p>текст</p>
по id перехожу к нужной части страницы(но это немного не то):
$(function () {
$('a[href*=#]:not([href=#])').click(function () {
if (location.pathname.replace(/^//, '') == this.pathname.replace(/^//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
<select onchange="window.location.href=this.options[this.selectedIndex].value">
<option VALUE=""></option>
<option VALUE="#b1">1</option>
<option VALUE="#b2">2</option>
<option VALUE="#b3">3</option>
</select>
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP