Tabs for tm us

Size
2,798 Kb
Views
34,408

How do I make an tabs for tm us?

What is a tabs for tm us? How do you make a tabs for tm us? This script and codes were developed by Nikita Zubarets on 04 November 2022, Friday.

Tabs for tm us Previews

Tabs for tm us - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Tabs for tm us</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <ul class="pmt-opts-tabs clearfix"> <li class="is-active" data-href="#creditCards"> <h3> <span class="logo-shell" style="background-image: url(img-pmt/tab-icon-cc.png)"></span> <span class="tab-text">Credit Card</span> </h3> </li> <li data-href="#AMEX"> <a href="#AMEX"> <span class="logo-shell" style="background-image: url(img-pmt/logo-amex_93x25.png)"></span> <span class="tab-text">American Express Rewards Points</span> </a> </li> <li data-href="#digitalWallet"> <a href="#digitalWallet"> <span class="logo-shell" style="background-image: url(img-pmt/tab-icon-wallet.png)"></span> <span class="tab-text">Digital Wallet Options</span> </a> </li>
</ul>
<div id="creditCards" class="outer-container hide">creditCards</div>
<div id="AMEX" class="outer-container hide">AMEX</div>
<div id="digitalWallet" class="outer-container"> <h4>digitalWallet</h4> <a href="#callback" id="callback">callback</a> <div class="prepare_VME">.prepare_VME</div> <div class="succeful_VME" style="display: none;"> succeful_VME <a href="#VME_change_payment_method" id="VME_change_payment_method">VME_change_payment_method</a> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Tabs for tm us - Script Codes CSS Codes

.outer-container.hide { display: none; }
.outer-container { margin-top: -1px; }
.container-checkout-2 { background-color: #efefef; border: #cccccc solid 1px; padding: 15px 8px;
}
.container-checkout-2 .split-2 { width: 368px; }
.container-checkout-2 h4{ font-size: 12px !important; /* needed to override '#main h4' selector*/ margin-bottom: 10px;
}
.d-wallet-items { color: #727272;
}
.d-wallet-items li { margin-top: 8px;
}
.d-wallet-items li:first-child { margin-top: 0;
}
.ty-image { margin: 5px 12px 0 0; vertical-align: middle;
}
li.is-active, li.is-active a { color: red; }

Tabs for tm us - Script Codes JS Codes

function replacer($self, $revert) { if($revert && $revert.first) { $self = $revert.first.find("a"); } console.log($self); if($self.length) { var $h3 = $self.parents("ul").find("h3"); if($revert && $revert.last) { $h3 = $revert.last.find("h3"); } var $dataHref = $h3.parent().attr("data-href"); var $href = $self.attr("href"); var $newA = $("<a>"); var $newH3 = $("<h3>"); $self.parent().addClass("is-active").siblings().removeClass("is-active"); $self.replaceWith(function() { return $newH3.html( $(this).html() ); }); $h3.replaceWith(function() { return $newA.attr("href", $dataHref).html( $(this).html() ).click(function() { replacer( $(this) ); }); }); $(".pmt-light").focus(); toggleDivs($href); }
}
function toggleDivs($href) { $(".outer-container").addClass("hide"); $( $href ).removeClass("hide"); return false;
}
jQuery(function($) { $(".pmt-opts-tabs li a").click(function() { replacer( $(this) ); });
});
function vmeCallback(VmeEventType, eventData) { if (VmeEventType == "ok") { jQuery(".pmt-opts-tabs, #digitalWallet .prepare_VME, #digitalWallet .succeful_VME").toggle(); //Hide tabs, hide vme button & show success vme block }
}
jQuery(function($) { $("#VME_change_payment_method").click(function() { $(".pmt-opts-tabs").show(); //Show tabs //Set active first tab and deactivate last one replacer(null, {first: $(".pmt-opts-tabs li:first"), last: $(".pmt-opts-tabs li:last")}); }); $("#callback").click(function() { vmeCallback("ok"); });
});
Tabs for tm us - Script Codes
Tabs for tm us - Script Codes
Home Page Home
Developer Nikita Zubarets
Username snapson
Uploaded November 04, 2022
Rating 3
Size 2,798 Kb
Views 34,408
Do you need developer help for Tabs for tm us?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Nikita Zubarets (snapson) Script Codes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!