testing new jquery method of replacing image with background image

diff --git a/js/app.js b/js/app.js
index bc6814e..6a846cb 100644 (file)
--- a/js/app.js
+++ b/js/app.js
@@ -84,14 +84,15 @@ $(document).ready(function () {
         $("#carousel_ul").css("left", "-210px");
     }
     
-//     changing the img tag for category view from a source to having a background to make the sizes uniform
+//     changing the img tag for category view from a source to having a background to make the sizes uniform 
     $(".attachment-shop_catalog").each( function () {
-        var img_src = $(this).attr("src");
-        console.debug(img_src);
-        $(this).css("height", 175).css("width", 'auto');
-        $(this).css("background", 'url(' + img_src + ') no-repeat center center').css("background-size", "cover");
-        $(this).removeAttr("src");
-//        $(this).attr("src", "").attr("srcset", "" );
+        $(this).wrap('<div class="image_wrapper"></div>');
     });
     
+    $(".image_wrapper").each( function () {
+        var src = $(this).find('img').attr("src"); 
+        $(this).css("height", 175).css("width", 'auto');
+        $(this).css("background", 'url(' + src + ') no-repeat center center').css("background-size", "cover");
+        $(this).find('img').remove();
+    });  
 });

diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 50172e2..e9b4d24 100644 (file)
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -75,14 +75,15 @@ $(document).ready(function () {
         $("#carousel_ul").css("left", "-210px");
     }
     
-//     changing the img tag for category view from a source to having a background to make the sizes uniform
+//     changing the img tag for category view from a source to having a background to make the sizes uniform 
     $(".attachment-shop_catalog").each( function () {
-        var img_src = $(this).attr("src");
-        console.debug(img_src);
-        $(this).css("height", 175).css("width", 'auto');
-        $(this).css("background", 'url(' + img_src + ') no-repeat center center').css("background-size", "cover");
-        $(this).removeAttr("src");
-//        $(this).attr("src", "").attr("srcset", "" );
+        $(this).wrap('<div class="image_wrapper"></div>');
     });
     
+    $(".image_wrapper").each( function () {
+        var src = $(this).find('img').attr("src"); 
+        $(this).css("height", 175).css("width", 'auto');
+        $(this).css("background", 'url(' + src + ') no-repeat center center').css("background-size", "cover");
+        $(this).find('img').remove();
+    });  
 });