kasumil의 코딩 공작소

let tabEl = $('#tabs').children(); let dataStore = window.sessionStorage; if(dataStore.getItem('1-tabs')) { let selected = JSON.parse(dataStore.getItem('1-tabs')); $(tabEl).each((el) => { let elId = $(tabEl[el]).attr("id"); if(elId !== selected.selectId) { $(tabEl[el]).attr('aria-selected', false); $(tabEl[el]).removeClass('active'); let showTab = $(tabEl[el]).attr('data-bs-target'); $(showTab)...

기존 scrollspy가 적용된 template를 수정해서 써야하는 일이 생겼다. 하지만 이것은 기본적으로 scrollspy가 적용되어 scroll에 따라 먹히는 부분... 그래서 페이지 이동에 따라 작동되도록 nav를 수정해야했다. Link (current) Link nav는 위와 같은 상태로 둔다. https://getbootstrap.com/docs/3.4/components/#navbar Components · Bootstrap Extend form controls by adding text or buttons before, after, or on both sides of any text-based . Use .input-group with an .input-group-addon or .input..

Home Profile Contact ... ... ... nav-pills를 nav-tabs로 바꾸면 ui가 변경된다. js단 $('#myTab a').on('click', function (event) { event.preventDefault() $(this).tab('show') }) 그냥 이렇게 쓰면 될걸. 괜히 부트스트랩 공홈꺼 긁어가서 쓰다가 이상한 attribute가 덕지덕지 붙어 있어서 고생했다. 그거때문에 작동이 안되서 괜히 30분이상 시간 낭비.

기본적으로 보통 부트스트랩을 통해서 tab widget을 사용할 것이다. 그러나 만약 다른 곳과 연동하여 원격으로 위젯을 선택할 경우 이를 컨트롤 해야하는 경우가 있다. 임시로 만들어본 샘플 HTML. 하단의 UL 태그가 따로 있을 것이고 동그라미들은 순수 div로 만든 ui이다. 그러면 동그라미 클릭시 어떻게 다른 것을 컨트롤 할 수 있을까? 난 보통 trigger 이벤트나 click()인줄 알았는데, 이게 아니라 tab()명령어로 사용이 가능하다. $('#changetabbutton').click(function(e){ // e.preventDefault(); $('#mytabs a[href="#second"]').tab('show'); }) 'e.preventDefault()'의 경우에는 해당 부분..