レガシーコード（javascript）を使用するプロジェクトと、現在「タブ」を使用するロジック用のeコマースフレームワークで作業します。クライアントはタブの代わりにラジオボタンが欲しいと決めました。既存のタブのスタイリングはラジオボタンのようになります
基本的な構造はul> liであり、ここではliはスタイリングされ、hrefとスタイリングクラスを持つタブのように動作します。
ラジオボタンで機能させるためにすべてを再配線しようとするのではなく、ラジオボタンのようにタブをスタイルする方法を見つけようとしています。それも可能ですか？
私はそれを行う方法をお見せするためにリンクをした：
<body>
<ul>
<li><div class="middle"></div></li>
<li><div class="middle"></div></li>
<li><div class="middle"></div></li>
</ul>
</body>
li {
display: inline-block;
height: 20px;
width: 20px;
border: 1px solid black;
border-radius: 50%
}
.middle {
height: 10px;
width: 10px;
background: black;
margin:5px;
border-radius: 50%;
visibility: hidden;
}
$(document).ready(function() {
$('li').on('click', function() {
$('.middle').css({
'visibility': 'hidden'
})
$(this).children().css({
'visibility': 'visible'
});
});
});
https://jsfiddle.net/2zavkjjf/
https://jsfiddle.net/2zavkjjf/ –
チェックアウトこのペンを、この人はあなた https://codepen.io/AngelaVelasquez/pen/のために働くかもしれない何かを行っていますEypnq –
ありがとうございますが、それはラジオボタンを使用し、それらを単にスタイル変更します。私は何かをラジオボタンのように見せたい。 – codemonkey