I am working with the ResponsiveTabs module from PeteLove.com. http://www.petelove.com/responsiveTabs/
I would like to make a change into it because I need an onclick event added to the tabs. Now this should be done I believe in the following code section.
// CREATE TAB ITEMS (VISIBLE ON DESKTOP)
//create tab list item from heading
//associate tab list item with tab panel
var $tabListItem = $('<li/>', {
'class': 'responsive-tabs__list__item',
id: 'tablist' + tablistcount + '-tab' + tabcount,
'aria-controls': 'tablist' + tablistcount +'-panel' + tabcount,
'role': 'tab',
tabindex: 0,
text: $tabHeading.text(),
keydown: function (objEvent) {
if (objEvent.keyCode === 13) { // if user presses 'enter'
$tabListItem.click();
}
},
click: function() {
//Show associated panel
Now I expected to see somewhere <li>
so that I could do <li onclick="setBrowserFrameSource(); return false;">
but there is no <li>
anywhere just the closing brackets. So I should add it to the code above. I have tried to add it as follows:
'role': 'tab',
'onclick="setBrowserFrameSource(); return false;"',
tabindex: 0,
But this broke the entire thing. Any help would be appreciated. Thanks in advance.
According to the instructions from the website petelove.com (full link in original question) you need to start the tabs with:
Then the plugin will do the rest. So I thought instead of adding for each
<li>
an onclick event why not add it to the container element. Which I did and it is working. So I now have the following.Now every time a tab is clicked it does its functions.