instagram喜欢将鼠标悬停在图像上时显示的数量

时间:2015-10-23 20:13:13

标签: javascript jquery html5 css3

是否有可能将Instagram的数量计入我的不安全状态?

我希望看到像enter image description here

这样的结果

当鼠标悬停在图像上时,会出现类似的计数,

在我的工作中需要添加哪些代码?:



$(document).ready(function(){
  
  Instafeed.prototype._makeTemplate = function (template, data) {
    var output, pattern, varName, varValue, _ref;
    pattern = /(?:\#{2})([\w\[\]\.]+)(?:\#{2})/;
    output = template;
    while (pattern.test(output)) {
      varName = output.match(pattern)[1];
      varValue = (_ref = this._getObjectProperty(data, varName)) != null ? _ref : '';
      output = output.replace(pattern, "" + varValue);
    }
    return output;
  };
  
  //<a href="##link##"> // original image link
     
  var feed = new Instafeed({
    target: 'instafeed',
    get: 'user',
    userId: 8303117,
	accessToken: '8303117.467ede5.360077337739443ab81ddc05f94ef38d',
    tagName: '{{settings.instafeed_tags}}',
    limit: 8,
    links: true,
    sortBy: 'most-recent',
    clientId: '{{settings.instafeed_client_id}}',
    resolution: 'standard_resolution',
    template: '<div class="cus-col-md-3" style="padding:0;"><a href="##link##" target="_blank" class="zoom" style="background-image: url(##image##);"></a></div>',
    after: function() {
   	  
      if (!this.hasNext()) {
	
      }
      
    },
    before: function () {
      
      $('#instafeed').empty();
      
    },
  });
  
  $(document).find('.livery-instafeed-navigation').on('click', 'a', function (e) {
  	feed.next();
  	e.preventDefault();
  });
  
  feed.run();
  /*userId: 8303117
accessToken: 8303117.467ede5.360077337739443ab81ddc05f94ef38d
  
  */
  
});
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

我自己就是这样做的。您可以使用此{{likes}}来获取图片所具有的数量。 你应该把它放在你的instafeed模板中。

替换它:

<div class="cus-col-md-3" style="padding:0;"><a href="##link##" target="_blank" class="zoom" style="background-image: url(##image##);"></a></div>

有了这个:

<div class="cus-col-md-3" style="padding:0;"><a href="##link##" target="_blank" class="zoom" style="background-image: url(##image##);"><div class="likes">{{likes}}</div></a></div>

使用CSS将其放置在您想要的位置,隐藏它并在悬停时显示它。

您可以在此处阅读有关模板化不安全的更多信息: https://github.com/stevenschobert/instafeed.js#templating

希望这有帮助。