jquery - 我可以缩短这个 jQuery 吗？

Question

<分区>

Answer 1

您可以将所有 JS 放入一个脚本中:

<script type="text/javascript">
Galleria.loadTheme('/galleria/themes/classic/galleria.classic.min.js');

jQuery(document).ready(function() { 
  /* This is basic - uses default settings */
  $("a#single_image").fancybox();

  /* Using custom settings */
  $("a#inline").fancybox({
    'hideOnContentClick': true
  });

  /* Apply fancybox to multiple items */  
  $("a.group").fancybox({
    'transitionIn'  :   'elastic',
    'transitionOut' :   'elastic',
    'speedIn'       :   600, 
    'speedOut'      :   200, 
    'overlayShow'   :   false
  });

  // STEVE A DIV
  $("#firstpagename, #firstpagename2").click(function () {
    $("div#white").toggle();
    $("div#v2black, div#v3black").hide();
  });

  $("#secondpagename, #secondpagename2").click(function () {
    $("div#v2black").toggle();
    $("div#white, #v3black").hide();
  });

  $("#thirdpagename, #thirdpagename2").click(function () {
    $("div#v3black").toggle();
    $("div#white, #v2black").hide();
  });

  $(".toggle").click(function(){
    $(".toggle").hide();
    $(this).toggle();
  });


  // MAIN TOP NAV SCROLLING

  $(window).scroll(function() {
    if ($(this).scrollTop() >= 591) {
      $(".altstevenav:hidden, .topwhiteborder:hidden").show();
    }
    else {
      $(".altstevenav:visible, .topwhiteborder:visible").hide();
    }
  });

  var select = $('a[href$=".bmp"],a[href$=".gif"],a[href$=".jpg"],a[href$=".jpeg"],a[href$=".png"],a[href$=".BMP"],a[href$=".GIF"],a[href$=".JPG"],a[href$=".JPEG"],a[href$=".PNG"]');
  select.attr('rel', 'fancybox');
  select.fancybox();
});

</script>

您还可以将所有 JS 库(fancybox、galleria 等)组合到一个 libraries.js 文件中。当然，将上述 JS 移动到外部 scripts.js 文件中。

此外，您调用了 jquery 两次，调用了 fancybox 两次，因此应该分别删除一个实例。

我不确定 WordPress 允许您优化多少，但减少 JS 和 CSS 文件的数量将是有益的。最佳实践，您需要调用 jquery、一个 libraries.js 和一个 scripts.js，而没有其他 JS(外部或内联)。