javascript onmouseover縮略圖

Question

反正有放大顏色樣本/鼠標懸停的小屬性嗎？並且我想在javascript中顯示所選屬性的標籤？

我的代碼是：

getOptionText: function(elem, value, config){ 
    var text = $(elem).innerHTML; 
    var configType = this.getConfigValue(config, 'type', false); 
    if (!configType) { 
     return text; 
    } 
    switch (config.type) { 
     case 'custom_images': 
      var image = this.getConfigValue(config, 'images/' + value, false); 
      if (image) { 
       text = '<img src="' + image + '" alt="' + text +'" />'; 
      } 
      break; 
     case 'product_images': 
      //get the images 
      var imageAttribute = this.getConfigValue(config, 'product_images', ''); 
      var images = this.getConfigValue(this.config.images, imageAttribute, []); 
      //get first allowed product 
      var attrId = $(elem).parentNode.id.replace(/[a-z]*/, ''); 
      var options = this.getConfigValue(this.config.attributes, attrId + '/options', false); 
      var productId = this.getFirstProductId(options, value); 
      if (productId && (image = this.getConfigValue(images, productId, false))) { 
       text = '<img src="' + image + '" alt="' + text +'" />'; 
      } 
      break; 
     case 'colors': 
      var color = this.getConfigValue(config, 'color/' + value, false); 
      if (color) { 
       text = '<span class="switcher-hexacode" title="' + image + '" style="background-color:' + color +'"></span>' 
      } 
      break; 
     default: 
      text = this.handleCustomOptionText(text, elem, value, config); 
      break; 
    } 
    return text; 
}, 

是這樣的形象。

Answer 1

您可以使用jQuery改變的小圖像的CSS類放大，或顯示先前隱藏的放大圖像。

使用：

$(//selector of your swatch).hover(function(){ $(this).addClass(//a class that makes me big); },function(){ $(this).removeClass(//the class just added); });

這裏的顯示用簡單的盒子http://jsfiddle.net/pjim/e8cjr8hz/

希望這是有幫助的