动态加载bootstrap药丸的内容

Question

所以我在我的网站上获得了1000张图片，其中每张图片都在一个不同的导航丸中，总共100粒。事情是目前进入网站后加载的整个1000张图片，我认为会产生太多不必要的流量。我想要的是（显然）只加载我点击/活动的药丸内的图像。当我只能看到10个图像时，为什么我要预加载1000个图像？这些Bootstrap的家伙不会认为这太多了。

当前代码

     .tab-content(style="height:400px; overflow:auto")
       #menuflamenco.tab-pane.fade
         -for (i in flamenco){  
          img#flamenco(src='./img/paisaje/' + flamenco[i], style='width:300px;height:300px')
          -}  
       #menutoro.tab-pane.fade
         -for (i in toro){  
          img#toro(src='./img/paisaje/' + toro[i], style='width:200px;height:200px;')
          -}