JSFiddle - React, Tailwind, and code Playground

by vaibviad

HTML

<a href="/mission.jpg" target="_blank"><img class="alignnone size-medium wp-image-1270" src="/mission-300x289.jpg" alt="mission" width="300" height="289" /></a>

<a href="/mission_1.jpg"><img class="alignnone size-medium wp-image-1271" src="/mission-300x289.jpg" alt="mission_1" width="300" height="289" /></a>

<a></a>

CSS

.picture{
    height:100%;
    min-height: 240px;        
    background: url("http://lorempixel.com/600/800/sports/Dummy-Text/") no-repeat;
    background-size: cover;
    background-position: 50% 50%;
   }


  @media screen and (max-width: 480px) { /* here */
      .picture {
       height: 80px;
       transform:scale(.3);
      }
  } /* here */

JavaScript

$("a:has(img)").each(function() { 
    var x=$(this).attr('target');
    
    if(x!="_blank"){
      //do your stuff here
    $(this).remove();
    $(this).replaceWith($(this).children()); 
    }
})