Skip to content

Instantly share code, notes, and snippets.

@Ezekiel1349
Created June 16, 2023 09:57
Show Gist options
  • Select an option

  • Save Ezekiel1349/728f0e18d1b4e8d5ad99ccaa22daae15 to your computer and use it in GitHub Desktop.

Select an option

Save Ezekiel1349/728f0e18d1b4e8d5ad99ccaa22daae15 to your computer and use it in GitHub Desktop.
Roaming Destacado
var npSElements = document.querySelectorAll('.np-s');
npSElements.forEach(function(element) {
var roam = element.querySelector('[data-modal="#movistar-roaming"]');
var roamTxt = element.querySelector('[data-modal="#movistar-roaming"] p > em:last-of-type');
var roamBox = element.querySelector('.np-s-content > a');
if (roam !== null) {
var npRoamingBox = document.createElement('span');
npRoamingBox.className = 'np_roaming_box';
npRoamingBox.innerHTML = '<span class="icon icon-roa"></span><span><em>Roaming:</em> ' + roamTxt.textContent + '</span>';
roamBox.insertAdjacentElement('afterend', npRoamingBox);
var roamBtn = element.querySelector('.np_roaming_box');
var roamTrigger = element.querySelector('[data-modal="#movistar-roaming"]');
if (roamBtn !== null) {
roamBtn.addEventListener('click', function() {
roamTrigger.click();
});
}
}
});
jQuery('.np-s').each(function() {
var roam = jQuery('[data-modal="#movistar-roaming"]', this).html();
var roamtxt = jQuery('[data-modal="#movistar-roaming"] p> em:last-of-type', this).text();
var roambox = jQuery('.np-s-content> a', this);
if (roam !== undefined) {
jQuery('<span class="np_roaming_box"><span class="icon icon-roa"></span><span><em>Roaming:</em> ' + roamtxt + '</span></span>').insertAfter(roambox);
}
var roambtn = jQuery('.np_roaming_box', this);
var roamtrigger = jQuery('[data-modal="#movistar-roaming"]', this);
jQuery(roambtn).click(function() {
jQuery(roamtrigger).trigger('click');
})
});
.np_roaming_box {
display: flex;
gap: 10px;
padding: 10px 0;
font-size: 14px;
line-height: 130%;
max-width: 210px;
cursor: pointer;
transition: color 0.2s ease-in-out;
}
.np_roaming_box:hover {
color: #019df4;
}
[data-modal="#movistar-roaming"] {
display: none !important;
}
@media (max-width: 991px) {
.np_roaming_box {
padding: 10px 0 0;
max-width: unset;
align-items: center;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment