2017-07-06 11 views
-5

Uncaught TypeError: $ is not a function

ここには "custom-isotope-portfolio.js"ファイルがあります。誰が何が間違っているか知っていますか?

これは語彙サイトです。あなたはjqueryのは、ロードされていないテーマ

enter image description here

if (!$) $ = jQuery; 
 

 
// Isotope for Portfolio 
 

 
$(document).ready(function() { 
 
\t ('.vivaco-grid[id^="gridwrapper_"]').each(function() { 
 
\t \t var $div = $(this), 
 
\t \t \t token = $div.data('token'), 
 
\t \t \t settingObj = window['vsc_grid_' + token], 
 
\t \t \t $container = null, 
 
\t \t \t $optionSets = null, 
 
\t \t \t grid_gutter_width = settingObj.gutter_width; 
 

 
\t \t if (typeof settingObj === 'undefined') { 
 
\t \t \t $container = $(".grid_portfolio"); 
 
\t \t \t $optionSets = $('#gridwrapper_portfolio #options .option-set'); 
 

 
\t \t }else { 
 
\t \t \t $container = $(".grid_"+settingObj.id+""); 
 
\t \t \t $optionSets = $('#gridwrapper_'+settingObj.id+' #options .option-set'); 
 

 
\t \t } 
 

 
\t \t colWidth = function() { 
 
\t \t \t var w = $container.width(), 
 
\t \t \t \t columnNum = 1, 
 
\t \t \t \t columnWidth = 0; 
 

 
\t \t \t vals = settingObj.vals 
 

 
\t \t \t // apply default settings 
 
\t \t \t if (vals.grid_manager != 1) { 
 
\t \t \t \t if (w > 1440) { 
 
\t \t \t \t \t columnNum = 4; 
 

 
\t \t \t \t } else if (w > 1365) { 
 
\t \t \t \t \t columnNum = 3; 
 

 
\t \t \t \t } else if (w > 1279) { 
 
\t \t \t \t \t columnNum = 3; 
 

 
\t \t \t \t } else if (w > 1023) { 
 
\t \t \t \t \t columnNum = 3; 
 

 
\t \t \t \t } else if (w > 767) { 
 
\t \t \t \t \t columnNum = 2; 
 

 
\t \t \t \t } else if (w > 479) { 
 
\t \t \t \t \t columnNum = 2; 
 

 
\t \t \t \t } 
 

 
\t \t \t }else { // apply custom settings 
 
\t \t \t \t if (w > 1440) { 
 
\t \t \t \t \t columnNum = vals.grid_very_wide; 
 

 
\t \t \t \t } else if (w > 1365) { 
 
\t \t \t \t \t columnNum = vals.grid_wide; 
 

 
\t \t \t \t } else if (w > 1279) { 
 
\t \t \t \t \t columnNum = vals.grid_normal; 
 

 
\t \t \t \t } else if (w > 1023) { 
 
\t \t \t \t \t columnNum = vals.grid_small; 
 

 
\t \t \t \t } else if (w > 767) { 
 
\t \t \t \t \t columnNum = vals.grid_tablet; 
 

 
\t \t \t \t } else if (w > 479) { 
 
\t \t \t \t \t columnNum = vals.grid_phone; 
 

 
\t \t \t \t } 
 
\t \t \t } 
 

 

 
\t \t \t columnWidth = Math.floor(w/columnNum); 
 

 
\t \t \t $container.find('.grid-item').each(function() { 
 
\t \t \t \t var $item = $(this), 
 
\t \t \t \t \t gwidth = 0; 
 

 
\t \t \t \t if (vals.grid_manager == 1) { 
 
\t \t \t \t \t gwidth = grid_gutter_width; 
 

 
\t \t \t \t } 
 

 
\t \t \t \t $item.css({'margin': Math.floor(gwidth/2)}); 
 

 
\t \t \t \t if ($item.hasClass('item-wide')) { 
 
\t \t \t \t \t if (w < 480) { 
 
\t \t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : Math.round(((columnWidth)-gwidth) * 0.7777777) + 'px' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t }else { 
 
\t \t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth*2)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : Math.round(((columnWidth*2)-gwidth) * 0.7777777) + 'px' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth*2)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t } 
 
\t \t \t \t } 
 

 
\t \t \t \t if ($item.hasClass('item-small')) { 
 
\t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t 'height' : Math.round(((columnWidth)-gwidth) * 0.7777777) + 'px' 
 
\t \t \t \t \t }); 
 

 
\t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t }); 
 

 
\t \t \t \t } 
 

 
\t \t \t \t if ($item.hasClass('item-long')) { 
 
\t \t \t \t \t if (w < 480) { 
 
\t \t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : Math.round(((columnWidth)-gwidth) * 0.7777777/2) + 'px' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t }else { 
 
\t \t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth*2)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : Math.round(((columnWidth)-gwidth) * 0.7777777) + 'px' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t \t 'width' : ((columnWidth*2)-gwidth) + 'px', 
 
\t \t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t \t }); 
 

 
\t \t \t \t \t } 
 
\t \t \t \t } 
 

 
\t \t \t \t if ($item.hasClass('item-high')) { 
 
\t \t \t \t \t $item.css({ 
 
\t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t 'height' : Math.round(((columnWidth*2)-gwidth) * 0.7777777) +'px' 
 
\t \t \t \t \t }); 
 

 
\t \t \t \t \t $item.find('img').css({ 
 
\t \t \t \t \t \t 'width' : ((columnWidth)-gwidth) + 'px', 
 
\t \t \t \t \t \t 'height' : '100%' 
 
\t \t \t \t \t }); 
 

 
\t \t \t \t } 
 
\t \t \t }); 
 

 
\t \t \t return columnWidth; 
 
\t \t } 
 

 
\t \t // Isotope Call 
 
\t \t gridIsotope = function() { 
 
\t \t \t $container.isotope({ 
 
\t \t \t \t layoutMode : 'masonry', 
 
\t \t \t \t itemSelector: '.grid-item', 
 
\t \t \t \t animationEngine: 'jquery', 
 
\t \t \t \t resizable: false, 
 
\t \t \t \t masonry: { columnWidth: colWidth(), gutter: 35, isFitWidth: true } 
 
\t \t \t }); 
 
\t \t }; 
 
\t \t gridIsotope(); 
 
\t \t $(window).smartresize(gridIsotope); 
 

 

 
\t \t // Portfolio Filtering 
 
\t \t $optionLinks = $optionSets.find('a'); 
 

 
\t \t $optionLinks.click(function() { 
 
\t \t \t var $this = $(this); 
 
\t \t \t var $optionSet = $this.parents('.option-set'); 
 

 
\t \t \t // don't proceed if already selected 
 
\t \t \t if ($this.hasClass('selected')) return false; 
 

 
\t \t \t $optionSet.find('.selected').removeClass('selected'); 
 
\t \t \t $this.addClass('selected'); 
 

 
\t \t \t // make option object dynamically, i.e. { filter: '.my-filter-class' } 
 
\t \t \t var options = {}, 
 
\t \t \t \t key = $optionSet.attr('data-option-key'), 
 
\t \t \t \t value = $this.attr('data-option-value'); 
 

 
\t \t \t // parse 'false' as false boolean 
 
\t \t \t value = value === 'false' ? false : value; 
 
\t \t \t options[ key ] = value; 
 

 
\t \t \t if (key === 'layoutMode' && typeof changeLayoutMode === 'function') { 
 
\t \t \t \t changeLayoutMode($this, options); // changes in layout modes need extra logic 
 

 
\t \t \t } else { 
 
\t \t \t \t $container.isotope(options); // otherwise, apply new options 
 

 
\t \t \t } 
 

 
\t \t \t return false; 
 
\t \t }); 
 
\t }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

+0

あなたはJqueryを読み込みませんでした。 – Nicolas

+0

このエラーは、JQueryが見つからないことを意味します。 –

+0

スクリーンショットを見てください。エラーのスタックトレース*にはjquery.jsからの呼び出しが含まれています –

答えて

0

に問題があるように見えます。 cdnを使用して読み込みしてください。

+0

スクリーンショットを見てください。エラーのスタックトレース*にはjquery.jsからの呼び出しが含まれています –

+1

ただし、スニペットにはjqueryは含まれていません。一定。 – James

関連する問題