Web Development

Show Facebook, Twitter, Instagram, Linkedin, Pinterest, Youtube and more social icon using Fontawesome

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/all.css" />

<style>
.social-icons a {
    text-decoration: none;
    color: orange;
    margin-right: 12px;
    padding: 0px;
    font-size: 27px;
}
</style>

	<div class="social-icons">
  <div class="social-icons__icons">
    

  <a class="slink" href="Your Twitter URL">
    <i class="fab fa-twitter"></i>
  </a>


  <a class="slink"  href="Your Instagram URL">
    <i class="fab fa-instagram"></i>
  </a>

  <a class="slink"  href="Your linkedin URL">
    <i class="fab fa-linkedin-in"></i>
  </a>

  <a class="slink"  href="Your Pinterest URL">
    <i class="fab fa-pinterest"></i>
  </a>


  <a class="slink"  href="Your Youtube URL">
    <i class="fab fa-youtube"></i>
  </a>
  
  
    <a class="slink"  href="Your Facebook URL">
    <i class="fab fa-facebook"></i>
  </a>


</div>
</div>

This Fontawesome file supports this social icons

Using the html code above and using the class below you can use those social icons. If you face any issue please feel free to let me know in comments section

  • fab fa-facebook-f: Facebook
  • fab fa-twitter: Twitter
  • fab fa-instagram: Instagram
  • fab fa-linkedin-in: LinkedIn
  • fab fa-youtube: YouTube
  • fab fa-pinterest-p: Pinterest
  • fab fa-snapchat-ghost: Snapchat
  • fab fa-tumblr: Tumblr
  • fab fa-reddit: Reddit
  • fab fa-whatsapp: WhatsApp
  • fab fa-telegram: Telegram
  • fab fa-skype: Skype
  • fab fa-discord: Discord
  • fab fa-tiktok: TikTok
  • fab fa-500px: 500px
  • fab fa-accessible-icon: Accessible Icon
  • fab fa-accusoft: Accusoft
  • fab fa-acquisitions-incorporated: Acquisitions Incorporated
  • fab fa-adn: App.net
  • fab fa-adobe: Adobe
  • fab fa-adversal: Adversal
  • fab fa-affiliatetheme: affiliatetheme
  • fab fa-airbnb: Airbnb
  • fab fa-algolia: Algolia
  • fab fa-alipay: Alipay
  • fab fa-amazon: Amazon
  • fab fa-amazon-pay: Amazon Pay
  • fab fa-amilia: Amilia
  • fab fa-android: Android
  • fab fa-angellist: AngelList
  • fab fa-angrycreative: Angry Creative
  • fab fa-angular: Angular
  • fab fa-app-store: App Store
  • fab fa-app-store-ios: App Store iOS
  • fab fa-apper: Apper Systems AB
  • fab fa-apple: Apple
  • fab fa-apple-pay: Apple Pay
  • fab fa-artstation: ArtStation
  • fab fa-asymmetrik: Asymmetrik, Ltd.
  • fab fa-atlassian: Atlassian
  • fab fa-audible: Audible
  • fab fa-autoprefixer: Autoprefixer
  • fab fa-avianex: Avianex
  • fab fa-aviato: Aviato
  • fab fa-aws: Amazon Web Services (AWS)
  • fab fa-bandcamp: Bandcamp
  • fab fa-battle-net: Battle.net
  • fab fa-behance: Behance
  • fab fa-behance-square: Behance Square
  • fab fa-bitbucket: Bitbucket
  • fab fa-bitcoin: Bitcoin
  • fab fa-bity: Bity
  • fab fa-black-tie: Black Tie
  • fab fa-blackberry: BlackBerry
  • fab fa-blogger: Blogger
  • fab fa-blogger-b: Blogger B
  • fab fa-blender: Blender
  • fab fa-bluetooth: Bluetooth
  • fab fa-bluetooth-b: Bluetooth
  • fab fa-bootstrap: Bootstrap
  • fab fa-btc: Bitcoin
  • fab fa-buffer: Buffer
  • fab fa-buromobelexperte: Büromöbel-Experte GmbH & Co. KG.
  • fab fa-buy-n-large: Buy n Large
  • fab fa-buysellads: BuySellAds
  • fab fa-canadian-maple-leaf: Canadian Maple Leaf
  • fab fa-cc-amazon-pay: Amazon Pay Credit Card
  • fab fa-cc-amex: American Express Credit Card
  • fab fa-cc-apple-pay: Apple Pay Credit Card
  • fab fa-cc-diners-club: Diners Club Credit Card
  • fab fa-cc-discover: Discover Credit Card
  • fab fa-cc-jcb: JCB Credit Card
  • fab fa-cc-mastercard: MasterCard Credit Card
  • fab fa-cc-paypal: PayPal Credit Card
  • fab fa-cc-stripe: Stripe Credit Card
  • fab fa-cc-visa: Visa Credit Card
  • fab fa-centercode: Centercode
  • fab fa-centos: CentOS
  • fab fa-chrome: Chrome
  • fab fa-chromecast: Chromecast
  • fab fa-cloudflare: Cloudflare
  • fab fa-cloudscale: Cloudscale.ch
  • fab fa-cloudsmith: Cloudsmith
  • fab fa-cloudversify: cloud
Web Development

Simple Timezone carousel with next and previous button to show different times of countries, using jQuery, php and css: WordPress or php based sites

Here is a simple timezone carousel to show time of different countries in carousel format. You can use Next and Previous button to show Next 4 countries time. I have shared you the corresponding php, html and css code. If you face any issue, feel free to comments.


<div id="time-carousel" class="time-carousel">
  <?php 
    $timezone_identifiers = DateTimeZone::listIdentifiers(DateTimeZone::AMERICA | DateTimeZone::EUROPE);
    foreach($timezone_identifiers as $timezone) {
        $date = new DateTime('now', new DateTimeZone($timezone));
        echo '<div class="time-carousel-item">';
        echo '<h3>'.$timezone.'</h3>';
        echo '<p>' . $date->format('H:i') . '</p>';
        echo '</div>';
    }
  ?>
</div>
<a href="#" id="prev">Previous</a>
<a href="#" id="next">Next</a>

<script>
jQuery(document).ready(function(){
    var slideIndex = 0;
    showSlides();

    function showSlides() {
        var i;
        var slides = jQuery(".time-carousel-item");
        for (i = 0; i < slides.length; i++) {
            if(i < slideIndex || i >= slideIndex + 4) {
                slides.eq(i).hide();  
            } else {
                slides.eq(i).show();
            }
        }
    }

   jQuery("#prev").click(function(event){
    event.preventDefault();
    var slides = jQuery(".time-carousel-item");
    slideIndex = Math.max(0, slideIndex - 4);
    showSlides();
});

jQuery("#next").click(function(event){
    event.preventDefault();
    var slides = jQuery(".time-carousel-item");
    slideIndex = Math.min(slides.length - 4, slideIndex + 4);
    showSlides();
});
});
</script>
<style>
	.time-carousel {
  display: flex;
  flex-wrap: wrap;
}
.time-carousel {
    display: flex;
    flex-wrap: wrap;
}
.time-carousel-item {
    width: 25%;
    padding: 10px;
    text-align: center;
}
	.time-carousel-item h3 {
    font-size: 18px;
    font-weight: bold !IMPORTANT;
}
</style>	
Web Development

Click button and change image color using css only ( jQuery not needed)

Button Click and Image color will change using css only. No JQuery is needed.

Here is the code I am Sharing

CSS CODE

input[type='radio'] {
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 25px;
  height: 25px;
  background-size: 225px 70px;
  border-radius: 3px;
  z-index: 99999;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000;
}

input[type='radio']:hover{
  -webkit-filter: opacity(.4);
  filter: opacity(.4);   }

.red{ background: red; }

.red:checked{ background: linear-gradient(brown, red) }

.green{ background: green; }

.green:checked{ background: linear-gradient(green, lime);}

.red:checked ~ img,.red:checked ~ p img{
  -webkit-filter: opacity(.5) drop-shadow(0 0 0 red);
  filter: opacity(.5) drop-shadow(0 0 0 red);
}

.green:checked ~ img,.green:checked ~ p img{
  -webkit-filter: opacity(.5) drop-shadow(0 0 0 green);
  filter: opacity(.5) drop-shadow(0 0 0 green);
}

HTML CODE

  <input class='red' name='color' type='radio' />
  <input class='green' name='color' type='radio' />
 
  <img src="https://i.stack.imgur.com/bd7VJ.png"/>

   
   <p><strong><a>sample1</a></strong><br><a id="sample1"><img src="https://i.stack.imgur.com/bd7VJ.png" alt="sample1" height="74" title="sample1" class="invert"></a></p>
   
  <p><strong><a>sample2</a></strong><br><a id="sample2"><img src="https://i.stack.imgur.com/bd7VJ.png" alt="sample1" height="74" title="sample2" class="invert"></a></p>
 
Web Development

Menu Drag and scroll in left and right using Mouse : HTML CSS and JavaScript

Basically I got the code from Codepan. But I am describing it here again with my html and css for the novice users. I am sharing the CSS, HTML and Javascript related to it.

CSS

<style>
.menu {
    overflow-x: scroll;
    display: -webkit-box !important;
    flex-wrap: inherit !important;
    width: 251px;
}
ul.menu li {
    list-style: none;
    margin-right: 12px;
}
</style>

HTML

<ul class="menu">
<li><a>test 1</a></li>
<li><a>test 2</a></li>
<li><a>test 3</a></li>
<li><a>test 4</a></li>
<li><a>test 5</a></li>
<li><a>test 6</a></li>
<li><a>test 7</a></li>
<li><a>test 8</a></li>
<li><a>test 9</a></li>
<li><a>test 10</a></li>

</ul>

Javascript

<script>

const slider = document.querySelector('ul.menu');
let isDown = false;
let startX;
let scrollLeft;

slider.addEventListener('mousedown', (e) => {
  isDown = true;
  slider.classList.add('active');
  startX = e.pageX - slider.offsetLeft;
  scrollLeft = slider.scrollLeft;
});
slider.addEventListener('mouseleave', () => {
  isDown = false;
  slider.classList.remove('active');
});
slider.addEventListener('mouseup', () => {
  isDown = false;
  slider.classList.remove('active');
});
slider.addEventListener('mousemove', (e) => {
  if(!isDown) return;
  e.preventDefault();
  const x = e.pageX - slider.offsetLeft;
  const walk = (x - startX) * 3; //scroll-fast
  slider.scrollLeft = scrollLeft - walk;
 // console.log(walk);
});

</script>

Web Development

Based on the value in URL parameter change text or contact number in Content section

This post is for those who has knowledge about HTML and jQuery. I am sharing the code directly here, If you have any question or facing similar issue, feel free to ask question in comments section

<script>

 	jQuery(document).ready(function(){
  
var params = new window.URLSearchParams(window.location.search);
console.log(params.get('assigned_to'));
var coach=params.get('assigned_to');
	if (coach.toLowerCase().indexOf("terry") >= 0){
	var terryNumber='(832)xxx-xxxx';
	 
jQuery("div#call a").text(terryNumber);
jQuery("div#call a").attr("href", "tel:"+terryNumber);
	}
	else if(coach.toLowerCase().indexOf("paul") >= 0){
	var jimNumber='(760)xxxx-xxxx';
	 
jQuery("div#call a").text(jimNumber);
jQuery("div#call a").attr("href", "tel:"+jimNumber);
	}
else if(coach.toLowerCase().indexOf("newname") >= 0){
	var newnameNumber='(760)xxx-xxxx';
	 
jQuery("div#call a").text(newnameNumber);
jQuery("div#call a").attr("href", "tel:"+newnameNumber);
	} 
	
 }); 		
 

</script>
Web Development

Click Button and show Drop down menu using CSS and jQuery

You can use it in your html css based website.

	<script>


jQuery(document).ready(function() {
   

jQuery('.dropdown button#menu1').on('click',function(){
 var count=0;

if (  jQuery('ul.menu' ).hasClass("active")     ){ 

 jQuery('ul.menu').hide();
  jQuery('ul.menu').removeClass('active');
count=1
}

if(count!=1){
   jQuery('ul.menu').addClass('active');
   jQuery('ul.menu').show();
}




});






});

</script>
<style>
 
 
ul.menu.active {
    height: 150px !IMPORTANT;
    overflow-y: scroll;
}
 
 
.dropdown {
    display: block;
    margin-left: auto !IMPORTANT;
    margin-right: auto;
    width: 120px;
}
.dropdown ul.menu {
    width: 120px;
}
.dropdown ul.menu li.menu-item {
    line-height: 1rem;
    list-style: none;
}
.dropdown button#menu1 {
    width: 120px;
}
.dropdown ul.menu {
    width: 120px;
    margin-top: 0px;
    position: absolute;
}
 
</style>		
<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown">Menu
  <span class="caret"></span></button>
  <ul class="menu" style="display:none;">
    
 
	
	<li class="menu-item"><a href="#123">Home</a></li>
    <li class="menu-item"><a href="#0">About</a></li>
    <li class="menu-item"><a href="#0">Shop</a></li>
	<li class="menu-item"><a href="#0">Streamers</a></li>
    <li class="menu-item"><a href="#456">ABC</a></li>
    <li class="menu-item"><a href="#456">DEF</a></li>
    <li class="menu-item"><a href="#0">12345</a></li>
	<li class="menu-item"><a href="#0">Gallery</a></li>
    <li class="menu-item"><a href="#789">Submenu 1</a></li>
                <li class="menu-item"><a href="#0">Submenu 2</a></li>
                <li class="menu-item"><a href="#0">Submenu 3</a></li>
                <li class="menu-item"><a href="#0">Random Text</a></li>
                <li class="menu-item"><a href="#0">Submenu 5</a></li>
                <li class="menu-item"><a href="#0">Submenu 6</a></li>
				<li class="menu-item"><a href="#0">Contact</a></li>
	 		
   </ul>
</div>		
Web Development

Remove the title which generally shows when you mouse over or Hover over the image using jQuery

Just use this code and Replace section#wrapper-content with your image container

jQuery(document).ready(function(){
	jQuery("section#wrapper-content img").each(function(index, element) {
      jQuery(element).attr('data-title', jQuery(element).attr('title'));
   jQuery(element).removeAttr("title");
});
		});
Web Development

Stretch image so that it touches the edges of mobile screen using – WordPress pages or posts

If you want to stretch the images to full width or want the images to touch the edges of mobile screen then you can implement that using this jQuery and css. You can apply this in your wordpress post and pages images too.

Image will be touching the edge of mobile screen like this screenshot above

Here is the jQuery ( you will need to change the CSS Class in the code)

<script>
	jQuery(document).ready(function(){
	jQuery(".entry img").each(function(index, element) {
   jQuery(element).wrap("<span class='stretch'></span>");
});
		});
</script>

Related CSS

@media (min-width: 320px) and (max-width: 767px) { 
.stretch {
    margin-left: -25px !IMPORTANT;
    margin-right: -25px !IMPORTANT;
	display:block;
	}}
Web Development

Pass Country Name in English and Show Norway Translated Country Name using PHP function

Here is the PHP code, you can use it if you need it, the code courtesy is one of my valued client.

function en_country_to_no_country_code($country)
{

$countries = array(
'Afghanistan' => 'Afghanistan',
'Ålandsøyene' => 'Aland Islands',
'Albania' => 'Albania',
'Algerie' => 'Algeria',
'Amerikansk Samoa' => 'American Samoa',
'Andorra' => 'Andorra',
'Angola' => 'Angola',
'Anguilla' => 'Anguilla',
'Antarktis' => 'Antarctica',
'Antigua og Barbuda' => 'Antigua And Barbuda',
'Argentina' => 'Argentina',
'Armenia' => 'Armenia',
'Aruba' => 'Aruba',
'Australia' => 'Australia',
'Østerrike' => 'Austria',
'Aserbajdsjan' => 'Azerbaijan',
'Bahamas' => 'Bahamas',
'Bahrain' => 'Bahrain',
'Bangladesh' => 'Bangladesh',
'Barbados' => 'Barbados',
'Hviterussland' => 'Belarus',
'Belgia' => 'Belgium',
'Belize' => 'Belize',
'Benin' => 'Benin',
'Bermuda' => 'Bermuda',
'Bhutan' => 'Bhutan',
'Bolivia' => 'Bolivia',
'Bosnia-Hertsegovina' => 'Bosnia And Herzegovina',
'Botswana' => 'Botswana',
'Bouvetøya' => 'Bouvet Island',
'Brasil' => 'Brazil',
'Britisk territorium i det indiske hav' => 'British Indian Ocean Territory',
'Brunei Darussalam' => 'Brunei Darussalam',
'Bulgaria' => 'Bulgaria',
'Burkina Faso' => 'Burkina Faso',
'Burundi' => 'Burundi',
'Kambodsja' => 'Cambodia',
'Kamerun' => 'Cameroon',
'Canada' => 'Canada',
'Kapp Verde' => 'Cape Verde',
'Caymanøyene' => 'Cayman Islands',
'Den sentralafrikanske republikk'  => 'Central African Republic',
'Tsjad' => 'Chad',
'Chile' => 'Chile',
'Kina' => 'China',
'Juleøya' => 'Christmas Island',
'Kokosøyene (Keeling)' => 'Cocos (Keeling) Islands',
'Colombia' => 'Colombia',
'Komorene' => 'Comoros',
'Kongo' => 'Congo',
'Kongo, Den demokratiske republikken'  => 'Congo, Democratic Republic',
'Cookøyene' => 'Cook Islands',
'Costa Rica' => 'Costa Rica',
'Cote D\'Ivoire' => 'Cote D\'Ivoire',
'Kroatia' => 'Croatia',
'Cuba' => 'Cuba',
'Kypros' => 'Cyprus',
'Tsjekkia' => 'Czech Republic',
'Danmark' => 'Denmark',
'Djibouti' => 'Djibouti',
'Dominica' => 'Dominica',
'Den dominikanske republikk' => 'Dominican Republic',
'Ecuador' => 'Ecuador',
'Egypt' => 'Egypt',
'El Salvador' => 'El Salvador',
'Ekvatorial-Guinea' => 'Equatorial Guinea',
'Eritrea' => 'Eritrea',
'Estland' => 'Estonia',
'Etiopia' => 'Ethiopia',
'Falklandsøyene (Malvinas)' => 'Falkland Islands (Malvinas)',
'Færøyene' => 'Faroe Islands',
'Fiji' => 'Fiji',
'Finland' => 'Finland',
'Frankrike' => 'France',
'Fransk Guyana' => 'French Guiana',
'Fransk Polynesia' => 'French Polynesia',
'Franske sørlige territorier' => 'French Southern Territories',
'Gabon' => 'Gabon',
'Gambia' => 'Gambia',
'Georgia' => 'Georgia',
'Tyskland' => 'Germany',
'Ghana' => 'Ghana',
'Gibraltar' => 'Gibraltar',
'Hellas' => 'Greece',
'Grønland' => 'Greenland',
'Grenada' => 'Grenada',
'Guadeloupe' => 'Guadeloupe',
'Guam' => 'Guam',
'Guatemala' => 'Guatemala',
'Guernsey' => 'Guernsey',
'Guinea' => 'Guinea',
'Guinea-Bissau' => 'Guinea-Bissau',
'Guyana' => 'Guyana',
'Haiti' => 'Haiti',
'Heard Island og Mcdonald Islands' => 'Heard Island & Mcdonald Islands',
'Holy See(Vatikanstaten)' => 'Holy See (Vatican City State)',
'Honduras' => 'Honduras',
'Hong Kong' => 'Hong Kong',
'Ungarn' => 'Hungary',
'Island' => 'Iceland',
'India' => 'India',
'Indonesia' => 'Indonesia',
'Iran, Islamsk Republikk Av' => 'Iran, Islamic Republic Of',
'Irak' => 'Iraq',
'Irlanti' => 'Ireland',
'Mansaarella' => 'Isle Of Man',
'Israel' => 'Israel',
'Italia' => 'Italy',
'Jamaica' => 'Jamaica',
'Japan' => 'Japan',
'Jersey' => 'Jersey',
'Jordan' => 'Jordan',
'Kazakhstan' => 'Kazakhstan',
'Kenya' => 'Kenya',
'Kiribati' => 'Kiribati',
'Korea' => 'Korea',
'Kuwait' => 'Kuwait',
'Kirgisistan' => 'Kyrgyzstan',
'Lao' => 'Lao',
'Latvia' => 'Latvia',
'Libanon' => 'Lebanon',
'Lesotho' => 'Lesotho',
'Liberia' => 'Liberia',
'Libyske arabiske Jamahiriya' => 'Libyan Arab Jamahiriya',
'Liechtenstein' => 'Liechtenstein',
'Litauen' => 'Lithuania',
'Luxembourg' => 'Luxembourg',
'Macao' => 'Macao',
'Makedonia' => 'Macedonia',
'Madagaskar' => 'Madagascar',
'Malawi' => 'Malawi',
'Malaysia' => 'Malaysia',
'Maldivene' => 'Maldives',
'Mali' => 'Mali',
'Malta' => 'Malta',
'Marshalløyene' => 'Marshall Islands',
'Martinique' => 'Martinique',
'Mauritania' => 'Mauritania',
'Mauritius' => 'Mauritius',
'Mayotte' => 'Mayotte',
'Mexico' => 'Mexico',
'Mikronesia, fødererte stater' => 'Micronesia, Federated States Of',
'Moldova' => 'Moldova',
'Monaco' => 'Monaco',
'Mongolia' => 'Mongolia',
'Montenegro' => 'Montenegro',
'Montserrat' => 'Montserrat',
'Marokko' => 'Morocco',
'Mosambik' => 'Mozambique',
'Myanmar' => 'Myanmar',
'Namibia' => 'Namibia',
'Nauru' => 'Nauru',
'Nepal' => 'Nepal',
'Nederland' => 'Netherlands',
'De nederlandske Antillene' => 'Netherlands Antilles',
'Ny-Caledonia' => 'New Caledonia',
'New Zealand' => 'New Zealand',
'Nicaragua' => 'Nicaragua',
'Niger' => 'Niger',
'Nigeria' => 'Nigeria',
'Niue' => 'Niue',
'Norfolkøya' => 'Norfolk Island',
'Nord-Marianene' => 'Northern Mariana Islands',
'Norge' => 'Norway',
'Oman' => 'Oman',
'Pakistan' => 'Pakistan',
'Palau' => 'Palau',
'Palestinsk territorium, Okkupert' => 'Palestinian Territory, Occupied',
'Panama' => 'Panama',
'Papua Ny-Guinea' => 'Papua New Guinea',
'Paraguay' => 'Paraguay',
'Peru' => 'Peru',
'Filippinene' => 'Philippines',
'Pitcairn' => 'Pitcairn',
'Polen' => 'Poland',
'Portugal' => 'Portugal',
'Puerto Rico' => 'Puerto Rico',
'Qatar' => 'Qatar',
'Gjenforening' => 'Reunion',
'Romania' => 'Romania',
'Russland'  => 'Russian Federation',
'Rwanda' => 'Rwanda',
'Saint Barthelemy' => 'Saint Barthelemy',
'Saint Helena' => 'Saint Helena',
'Saint Kitts og Nevis' => 'Saint Kitts And Nevis',
'Saint Lucia' => 'Saint Lucia',
'Sankt Martin' => 'Saint Martin',
'Saint Pierre og Miquelon' => 'Saint Pierre And Miquelon',
'Saint Vincent og Grenadiner' => 'Saint Vincent And Grenadines',
'Samoa' => 'Samoa',
'San Marino' => 'San Marino',
'Sao Tome og Principe' => 'Sao Tome And Principe',
'Saudi-Arabia' => 'Saudi-Arabia',
'Senegal' => 'Senegal',
'Serbia' => 'Serbia',
'Seychellene',
'Sierra Leone' => 'Sierra Leone',
'Singapore' => 'Singapore',
'Slovakia' => 'Slovakia',
'Slovenia' => 'Slovenia',
'Salomonøyene' => 'Solomon Islands',
'Somalia' => 'Somalia',
'Sør-Afrika' => 'South Africa',
'South Georgia og Sandwich Isl.' => 'South Georgia And Sandwich Isl.',
'Spania' => 'Spain',
'Sri Lanka' => 'Sri Lanka',
'Sudan' => 'Sudan',
'Surinam' => 'Suriname',
'Svalbard og Jan Mayen' => 'Svalbard And Jan Mayen',
'Swazimaa' => 'Swaziland',
'Sverige' => 'Sweden',
'Sveits' => 'Switzerland',
'Den Syriske Arabiske Republikken' => 'Syrian Arab Republic',
'Taiwan' => 'Taiwan',
'Tadsjikistan' => 'Tajikistan',
'Tanzania' => 'Tanzania',
'Thailand' => 'Thailand',
'Timor-Leste' => 'Timor-Leste',
'Togo' => 'Togo',
'Tokelau' => 'Tokelau',
'Tonga' => 'Tonga',
'Trinidad og Tobago' => 'Trinidad And Tobago',
'Tunisia' => 'Tunisia',
'Tyrkia' => 'Turkey',
'Turkmenistan' => 'Turkmenistan',
'Turks- og Caicosøyene' => 'Turks And Caicos Islands',
'Tuvalu' => 'Tuvalu',
'Uganda' => 'Uganda',
'Ukraina' => 'Ukraine',
'De forente arabiske emirater' => 'United Arab Emirates',
'Storbritannia' => 'United Kingdom',
'Amerikas forente stater' => 'United States',
'Amerikas forente stater' => 'United States Outlying Islands',
'Uruguay' => 'Uruguay',
'Usbekistan' => 'Uzbekistan',
'Vanuatu' => 'Vanuatu',
'Venezuela' => 'Venezuela',
'Viet Nam' => 'Viet Nam',
'Jomfruøyene, Britisk' => 'Virgin Islands, British',
'Jomfruøyene, USA' => 'Jomfruøyene, USA',
'Wallis og Futuna' => 'Wallis And Futuna',
'Vest-Sahara' => 'Western Sahara',
'Jemen' => 'Yemen',
'Zambia' => 'Zambia',
'Zimbabwe' => 'Zimbabwe',
'NORD-AMERIKA' => 'NORTH AMERICA',
'EUROPA' => 'EUROPE',
'SØR-AMERIKA' => 'SOUTH AMERICA',
'ASIA' => 'ASIA',
'AFRIKA' => 'AFRICA',
'OSEANIA' => 'OCEANIA',
);

	// Set ISO
	$iso_code = strtolower(array_search(strtolower($country), array_map('strtolower', $countries)));

	return $iso_code;
}
Web Development

Remove Links and keep text in table or Div : Use it either for mobile or desktop

Suppose you have a table and you have information with links there. So in Desktop view you want to keep those information with links, but in mobile view you just want the information to show without wrapping links. Here is the JQuery code which i used to implement that. Basically i collected the code from stackoverflow and modified as per my requirements.

Here is the code

 <script>
$(document).ready(function() {
	  	 
	
	if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
		console.log(" mobile ");
  $('table tr td,table tr td').each(function(){
  
    if($(this).hasClass("nolink")){ 
    $(this).find("a").contents().unwrap();
    }
    });
}
});
 </script>