I was working on a website, I have a bunch of scripts working fine next to each other.
I implemented another masonry script, which works fine by itself, but when I put them with another script, I get an error in the Chrome console:
Uncaught SyntaxError: Unexpected end of input masonry.js:16
Uncaught TypeError: Object [object Object] has no method 'colladjust'
There might be some kind of collision of id or class variables. Or overwriting of objects.
Here is the masonry script:
<script type="text/javascript">
jQuery(document).ready(function($) {
var CollManag = (function() {
var $ctCollContainer = $('#ct-coll-container'),
collCnt = 1,
init = function() {
changeColCnt();
initEvents();
initPlugins();
},
changeColCnt = function() {
var w_w = $(window).width();
if( w_w <= 640 ) n = 1;
else if( w_w <= 1023 ) n = 2;
else n = 3;
},
initEvents = function() {
$(window).on( 'smartresize.CollManag', function( event ) {
changeColCnt();
});
},
initPlugins = function() {
$ctCollContainer.imagesLoaded( function(){
$ctCollContainer.masonry({
itemSelector : '.ct-coll-item',
columnWidth : function( containerWidth ) {
return containerWidth / n;
},
isAnimated : true,
animationOptions: {
duration: 400
}
});
});
$ctCollContainer.colladjust();
$ctCollContainer.find('div.ct-coll-item-multi').collslider();
};
return { init: init };
})();
CollManag.init();
});
</script>
And here is one of the conflicting scripts:
jQuery(document).ready(function($) {
$(document).ready(function() {
$('.sidebarlink').click(function(){
if ($("#content").hasClass("sidebar-active")){
$("#content").toggleClass("sidebar-active");
$("#content").toggleClass("sidebar-active-1600");
$(".sidebarbox").toggleClass("sidebar-active");
$(".sidebarlink").css( "opacity", 1 );
}else{
$("#content").toggleClass("sidebar-active");
$("#content").toggleClass("sidebar-active-1600");
$(".sidebarbox").toggleClass("sidebar-active");
$(".commentbox").removeClass("commentbox-active");
$("#content").removeClass("commentbox-active");
$("#content").removeClass("commentbox-active-1600");
$(".sidebarlink").css( "opacity", 0 );
$(".commentbox-link").css( "opacity", 1 );
}return false;
});
});
});
Your non masonry script poison's masonry.js by defining variables it is using. Find out which one it is by removing individual statements from the non masonry script until it begins working.
The solution may be as easy as changing the id and class variable names to something else.
Related
I have implemented infinite scroll with isotope on my website and I am having a problem with loading posts. The posts load fine, but lets say I scroll down to load more posts but I am still viewing the posts already there, infinite scroll jumps to the bottom of the page whenever new posts are loaded. How can I stop this behavior and maintain the position on the page even when more posts are loaded?
My script --
$(function () {
var selectChoice, updatePageState, updateFiltersFromObject,
$container = $('.isotope');
////////////////////////////////////////////////////////////////////////////////////
/// EVENT HANDLERS
////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////
// Mark filtering element as active/inactive and trigger filters update
$('.js-filter').on( 'click', '[data-filter]', function (event) {
event.preventDefault();
selectChoice($(this), {click: true});
$container.trigger('filter-update');
});
//////////////////////////////////////////////////////
// Sort filtered (or not) elements
$('.js-sort').on('click', '[data-sort]', function (event) {
event.preventDefault();
selectChoice($(this), {click: true});
$container.trigger('filter-update');
});
//////////////////////////////////////////////////////
// Listen to filters update event and update Isotope filters based on the marked elements
$container.on('filter-update', function (event, opts) {
var filters, sorting, push;
opts = opts || {};
filters = $('.js-filter li.active a:not([data-filter="all"])').map(function () {
return $(this).data('filter');
}).toArray();
sorting = $('.js-sort li.active a').map(function () {
return $(this).data('sort');
}).toArray();
if (typeof opts.pushState == 'undefined' || opts.pushState) {
updatePageState(filters, sorting);
}
$container.isotope({
filter: filters.join(''),
sortBy: sorting
});
});
//////////////////////////////////////////////////////
// Set a handler for history state change
History.Adapter.bind(window, 'statechange', function () {
var state = History.getState();
updateFiltersFromObject(state.data);
$container.trigger('filter-update', {pushState: false});
});
////////////////////////////////////////////////////////////////////////////////////
/// HELPERS FUNCTIONS
////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////
// Build an URI to get the query string to update the page history state
updatePageState = function (filters, sorting) {
var uri = new URI('');
$.each(filters, function (idx, filter) {
var match = /^\.([^-]+)-(.*)$/.exec(filter);
if (match && match.length == 3) {
uri.addSearch(match[1], match[2]);
}
});
$.each(sorting, function (idx, sort) {
uri.addSearch('sort', sort);
});
History.pushState(uri.search(true), null, uri.search() || '?');
};
//////////////////////////////////////////////////////
// Select the clicked (or from URL) choice in the dropdown menu
selectChoice = function ($link, opts) {
var $group = $link.closest('.btn-group'),
$li = $link.closest('li'),
mediumFilter = $group.length == 0;
if (mediumFilter) {
$group = $link.closest('.js-filter');
}
if (opts.click) {
$li.toggleClass('active');
} else {
$li.addClass('active');
}
$group.find('.active').not($li).removeClass('active');
if (!mediumFilter) {
if ($group.find('li.active').length == 0) {
$group.find('li:first-child').addClass('active');
}
$group.find('.selection').html($group.find('li.active a').first().html());
}
};
//////////////////////////////////////////////////////
// Update filters by the values in the current URL
updateFiltersFromObject = function (values) {
if ($.isEmptyObject(values)) {
$('.js-filter').each(function () {
selectChoice($(this).find('li').first(), {click: false});
});
selectChoice($('.js-sort').find('li').first(), {click: false});
} else {
$.each(values, function (key, val) {
val = typeof val == 'string' ? [val] : val;
$.each(val, function (idx, v) {
var $filter = $('[data-filter=".' + key + '-' + v + '"]'),
$sort = $('[data-sort="' + v + '"]');
if ($filter.length > 0) {
selectChoice($filter, {click: false});
} else if ($sort.length > 0) {
selectChoice($sort, {click: false});
}
});
});
}
};
////////////////////////////////////////////////////////////////////////////////////
/// Initialization
////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////
// Initialize Isotope
$container.imagesLoaded( function(){
$container.isotope({
masonry: { resizesContainer: true },
itemSelector: '.item',
getSortData: {
date: function ( itemElem ) {
var date = $( itemElem ).find('.thedate').text();
return parseInt( date.replace( /[\(\)]/g, '') );
},
area: function( itemElem ) { // function
var area = $( itemElem ).find('.thearea').text();
return parseInt( area.replace( /[\(\)]/g, '') );
},
price: function( itemElem ) { // function
var price = $( itemElem ).find('.theprice').text();
return parseInt( price.replace( /[\(\)]/g, '') );
}
}
});
var total = $(".next a:last").html();
var pgCount = 1;
var numPg = total;
// jQuery InfiniteScroll Plugin.
$container.infinitescroll({
contentSelector : '.isotope',
speed : 'fast',
behavior: 'simplyrecipes',
navSelector : '#pagi', // selector for the paged navigation
nextSelector : '#pagi a.next', // selector for the NEXT link (to page 2)
itemSelector : '.item', // selector for all items you'll retrieve
animate: true,
debug: true,
loading: {
selector: '#infscr-loading',
finishedMsg: 'No more content to load.'
}
},
// Trigger Masonry as a callback.
function( newElements ) {
pgCount++;
if(pgCount == numPg) {
$(window).unbind('.infscr');
$container.isotope('reload');
$container.append( newElements ).isotope( 'appended', newElements, true );
$('#infscr-loading').find('em').text('No more content to load.');
$('#infscr-loading').animate({
opacity: 1
}, 200);
setTimeout(function() {
$('#infscr-loading').animate({
opacity: 0
}, 300);
});
} else {
loadPosts(newElements);
}
});
});
function loadPosts(newElements) {
// Hide new posts while they are still loading.
var newElems = $( newElements ).css({ opacity: 0 });
// Ensure that images load before adding to masonry layout.
newElems.imagesLoaded(function() {
// Show new elements now that they're loaded.
newElems.animate({ opacity: 1 });
$container.isotope( 'appended', newElems, true );
});
}
//////////////////////////////////////////////////////
// Initialize counters
$('.stat-count').each(function () {
var $count = $(this),
filter = $count.closest('[data-filter]').data('filter');
$count.html($(filter).length);
});
//////////////////////////////////////////////////////
// Set initial filters from URL
updateFiltersFromObject(new URI().search(true));
$container.trigger('filter-update', {pushState: false});
});
});
You can start by overriding the default animate property of infinite-scroll
$container.infinitescroll({
animate:false, //this does just that
});
And about your dublicate entry for every request (or perhaps some requests ),
It has something to do with your backend i.e the way you are offseting the data
Infinite Scroll works great with page numbers i.e it
Sends 2,3,4,5,6 ... So For every request its sends that request.
I think you are using page offset instead , and you will probably end up with duplicate entries .
If you are using php as your receiving end ... this might help
//In your Controller
$temp = ( $page_offset * $per_page );
$offset = $temp - $per_page ;
//In your model
$this->db->query("SELECT * FROM GALLERY OFFSET $offset limit 10");
This is just a rough idea , I hope it helps.
If it does , Care to Check out Sticky Bubble ? - A game available for free on Google Play .
Cheers :)
I'm using masonry to generate 'tiles' - which I'm filtering with jQuery, and infinite scroll - which I'm using to load more tiles server-side.
The filter works, however once a filter is applied and more tiles are loaded via the infinite scroll, unfiltered items are loaded. I know that the reason behind this is because the unloaded tiles aren't generated client side yet, but I'd rather keep it that way because the website is going to get very data-heavy very fast.
Is there any way to do this without loading all of the items client side? I would be extremely appreciative of any input. I've included the infinite scroll script below. I noticed this link (www.creativebloq.com/web-design/filter-web-content-infinite-scroll-10134808), which sounds fairly relatable, however I'm not sure how it would be implemented.
!function($){
var $container = $(InfiniteConfig.container);
var pageCount = 0;
var cpage = 1;
var _next = $('div.k2Pagination a:contains("Next")'),
_divNext = $('.view-more'),
_btnNext = $('a#viewplus'),
_divLoading = $('div.k2-masonry-loading'),
_btnLoading = $('div.loading_spinner_wrapper');
$container.infinitescroll({
navSelector : InfiniteConfig.navSelector,
nextSelector: _next,
itemSelector: InfiniteConfig.itemSelector,
loading : {
selector : _divLoading,
img : _btnLoading.html(),
msgText : '',
speed: 'fast',
finishedMsg : InfiniteConfig.finishedMsg,
finished : function() {
_btnLoading.css('display','none');
setTimeout(function(){
_divNext.css('display','block');
},500);
},
},
errorCallback: function(){
_divNext.css('display','block');
_divLoading.remove();
_divNext.addClass('finished').html(InfiniteConfig.finishedMsg);
},
debug : true,
path : function () {
pageCount += 1;
var path = $(_next).attr('href')
var _url = [];
_url = path.split('start=');
_url[0] += "start";
url = _url[0];
numItems = parseInt(_url[1]);
nextLimit = numItems * (pageCount);
return [InfiniteConfig.baseURL + url + '=' + nextLimit];
}
},
function (newElements, data, url) {
var elemWidth = $('#itemListPrimary .itemContainer').width(),
$newElems = $( newElements ).css({ opacity: 0 , width: elemWidth});
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
});
$(window).unbind('.infscr');
_btnNext.click(function(){
_divNext.css('display','none');
_btnLoading.css('display','block');
$container.infinitescroll('retrieve');
return false;});
}(jQuery);
Thanks again.
Seeing as I know how much of a pain infinite scroll is, this is how I got round this.
I filtered the items by class in the newElements function, shown below.
function (newElements, data, url) {
var elemWidth = $('#itemListPrimary .itemContainer').width(),
$newElems = $( newElements ).css({ opacity: 0 , width: elemWidth});
$newElems.imagesLoaded(function(){
// show new elements
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
var children = $newElems.children();
// if filter is empty select all elements
if (!window.data) {
console.log("nothing selected");
}
// if filter is selected filter elements
else {
for (var i = 0; i < children.length; i++) {
if ($(this).hasClass(window.data)) {
$('.itemContainer').show();
} else {
$('.itemContainer').not('.' + window.data).hide();
}
// append layout
$(window).bind('resize.masonry orientationchange.masonry').trigger('resize.masonry');
};
};
});
});
I purchased a template from themeforest and am having a "Uncaught TypeError: Cannot call method 'each' of undefined" after I removed two of the three opening sliders. The error slows the page load time down to a crawl however the entire site is functional. Does 'each' reference the 3 original sliders and if so can I edit it to reference the 1 lone slider?
function init_main_slider(target) {
set_height();
jQuery(target).flexslider({
animation : 'fade',
controlNav : true,
directionNav : true,
animationLoop : true,
slideshow : false,
animationSpeed : 500,
useCSS : true,
start : function(slider) {
if(!isMobile) {
slider.slides.each(function(s) {
jQuery(this).find('.animated_item').each(function(n) {
jQuery(this).addClass('animate_item' + n);
});
});
slider.slides.eq(slider.currentSlide).find('.animated_item').each(function(n) {
var show_animation = jQuery(this).attr('data-animation');
jQuery(this).addClass(show_animation);
});
}
else {
slider.find('.counter').find('.num').each(function() {
var container = jQuery(this);
var num = container.attr('data-num');
var content = container.attr('data-content');
count_num(num, content, container, false);
});
}
},
before : function(slider) {
if(!isMobile) {
slider.slides.eq(slider.currentSlide).find('.animated_item').each(function(n) {
var show_animation = jQuery(this).attr('data-animation');
jQuery(this).removeClass(show_animation);
});
slider.slides.find('.animated_item').hide();
var counter_block = slider.slides.eq(slider.currentSlide).find('.counter');
if(counter_block.length > 0) {
setTimeout(function() {
counter_block.find('.num').each(function() {
jQuery(this).html('0');
});
}, 300);
}
}
},
after : function(slider) {
if(!isMobile) {
slider.slides.find('.animated_item').show();
slider.slides.eq(slider.currentSlide).find('.animated_item').each(function(n) {
var show_animation = jQuery(this).attr('data-animation');
jQuery(this).addClass(show_animation);
});
var counter_block = slider.slides.eq(slider.currentSlide).find('.counter');
if(counter_block.length > 0) {
counter_block.find('.num').each(function() {
var container = jQuery(this);
var num = container.attr('data-num');
var content = container.attr('data-content');
count_num(num, content, container, 1500);
});
}
}
}
});
function set_height() {
var w_height = jQuery(window).height();
jQuery(target).height(w_height).find('.slides > li').height(w_height);
}
jQuery(window).resize(function() {
set_height();
});
}
How did you "remove the sliders"? I noticed in the html that the slide still has a class of <li class="slide_3"> which might be causing issues for the plugin. Does it make a difference to remove that or change to just slide or slide_1? If you cant get it to cooperate one idea is that there really is no need for this slider when only have one image so you could count the number of <li> and only use that function when there is more than one image, otherwise insert the single image... something like.
jQuery(function() {
// count the list
var listSize = $(".slides li").size();
if (listSize < 2) {
$('#main_slider').prepend('<img src="images/pic_slider_1_3.png" alt="">')
} else {
init_main_slider('#main_slider');
}
});
In drupal i have generated a list where each item is a fieldset with collapsible, that can contain extra information.
Because of the rather large list i want to avoid loading the extra information until a user clicks on the fieldset.
Best case scenario:
User clicks on collapsed fieldset.
Fieldset loads extra information.
Fieldset uncollapses.
I've copied and loaded the copy of collapse.js into my form, but I'm very new to js and jQuery, so I'm a little lost. If someone can show me how to call a function the first time the fieldset is expanded, I'm sure i can figure out the rest.
I've included the code from collapse.js:
(function ($) {
//Toggle the visibility of a fieldset using smooth animations.
Drupal.toggleFieldset = function (fieldset) {
var $fieldset = $(fieldset);
if ($fieldset.is('.collapsed')) {
var $content = $('> .fieldset-wrapper', fieldset).hide();
$fieldset
.removeClass('collapsed')
.trigger({ type: 'collapsed', value: false })
.find('> legend span.fieldset-legend-prefix').html(Drupal.t('Hide'));
$content.slideDown({
duration: 'fast',
easing: 'linear',
complete: function () {
Drupal.collapseScrollIntoView(fieldset);
fieldset.animating = false;
},
step: function () {
// Scroll the fieldset into view.
Drupal.collapseScrollIntoView(fieldset);
}
});
}
else {
$fieldset.trigger({ type: 'collapsed', value: true });
$('> .fieldset-wrapper', fieldset).slideUp('fast', function () {
$fieldset
.addClass('collapsed')
.find('> legend span.fieldset-legend-prefix').html(Drupal.t('Show'));
fieldset.animating = false;
});
}
};
//Scroll a given fieldset into view as much as possible.
Drupal.collapseScrollIntoView = function (node) {
var h = document.documentElement.clientHeight || document.body.clientHeight || 0;
var offset = document.documentElement.scrollTop || document.body.scrollTop || 0;
var posY = $(node).offset().top;
var fudge = 55;
if (posY + node.offsetHeight + fudge > h + offset) {
if (node.offsetHeight > h) {
window.scrollTo(0, posY);
}
else {
window.scrollTo(0, posY + node.offsetHeight - h + fudge);
}
}
};
Drupal.behaviors.collapse = {
attach: function (context, settings) {
$('fieldset.collapsible', context).once('collapse', function () {
var $fieldset = $(this);
// Expand fieldset if there are errors inside, or if it contains an
// element that is targeted by the uri fragment identifier.
var anchor = location.hash && location.hash != '#' ? ', ' + location.hash : '';
if ($('.error' + anchor, $fieldset).length) {
$fieldset.removeClass('collapsed');
}
var summary = $('<span class="summary"></span>');
$fieldset.
bind('summaryUpdated', function () {
var text = $.trim($fieldset.drupalGetSummary());
summary.html(text ? ' (' + text + ')' : '');
})
.trigger('summaryUpdated');
// Turn the legend into a clickable link, but retain span.fieldset-legend
// for CSS positioning.
var $legend = $('> legend .fieldset-legend', this);
$('<span class="fieldset-legend-prefix element-invisible"></span>')
.append($fieldset.hasClass('collapsed') ? Drupal.t('Show') : Drupal.t('Hide'))
.prependTo($legend)
.after(' ');
// .wrapInner() does not retain bound events.
var $link = $('<a class="fieldset-title" href="#"></a>')
.prepend($legend.contents())
.appendTo($legend)
.click(function () {
var fieldset = $fieldset.get(0);
// Don't animate multiple times.
if (!fieldset.animating) {
fieldset.animating = true;
Drupal.toggleFieldset(fieldset);
}
return false;
});
$legend.append(summary);
});
}
};
})(jQuery);
It looks to me like you'd have to override the whole Drupal.toggleFieldset function (just like when you are overriding a Drupal theme function.
You could perhaps add a class to the fieldset in FormAPI then catch it in the complete function of the $content.slideDown params and fire a custom function of yours, to add a 'loading' graphic and make your ajax request.
I'm assuming from your question that you are familiar enough with FormAPI/jQuery.ajax() to have a go. But let me know if not and i'll include some snippets
EDIT
Here is some example code, it'd take a quite a while to setup a test environment for this, so it'just a pointer (cant create a JS fiddle for this ;))
You might add your fieldset like this in PHP
$form['my_fieldset'] = array(
'#type' = 'fieldset',
'#title' = t('My fieldset'),
'#collapsible' = true,
'#collapsed' = true,
'#attributes' => array(
'class' => array('ajax-fieldset'),
'rel' => 'callback/url/path' // random attribute to store the link to a menu path that will return your HTML
)
);
$form['my_fieldset'] = array(
'#markup' => '<div class="response">loading...</div>'
);
You'll also obviously have setup a menu hook returning your themed data # callback/url/path. IMO it's better to return JSON data and theme them in with JS templating, but the Drupal way (for the moment at least) seems to be to render HTML in the menu hook callback function.
Then here is the JS. I've only included the altered complete function, rather than reproduce what you pasted. Add the complete function in to a copy of the code the re-specify the core Drupal function in your own JS file
$content.slideDown({
complete: function () {
Drupal.collapseScrollIntoView(fieldset);
fieldset.animating = false;
if($fieldset.hasClass('ajax-fieldset')) {
$.get(
Drupal.settings.basePath + $fielset.attr('rel'),
function(data) {
$fieldset.find('.response').html(data);
}
)
}
}
});
Or, rather than messing around with the collapsible function. just create your own fieldset without the collapsible/collapsed classes and implement from scratch yourself
....so.. something like that :)
at first I'm loading all my js script in my header and it's all working properly. But I have one js file that need to be loaded inline/ load it in a certain page only.
this is the js file that I need to load
var myScroll,pullDownEl, pullDownOffset, generatedCount = 0;
function pullDownAction () {
setTimeout(function () {
var el, li, i;
el = document.getElementById('newlist');
if ( el.hasChildNodes() ) {
while ( el.childNodes.length >= 1 ) {
el.removeChild( el.firstChild );
}
}
for (i=0; i<6; i++) {
li = document.createElement('li');
li.innerText = 'Generated row ' + (++generatedCount);
el.insertBefore(li, el.childNodes[0]);
}
myScroll.refresh();
}, 1000);
}
function loaded() {
pullDownEl = document.getElementById('pullDown');
pullDownOffset = pullDownEl.offsetHeight;
myScroll = new iScroll('wrapper', {
//hideScrollbar: false,
//hScrollbar: false, vScrollbar: false, vScroll: false,
useTransition: true,
topOffset: pullDownOffset,
onRefresh: function () {
if (pullDownEl.className.match('loading')) {
pullDownEl.className = '';
pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Pull down to refresh...';
$('#pullDown').css('display', 'inherit');
$('#pullDown').css('display', 'none');
$('#thelist').css('display', 'none');
$('#newlist').css('display', 'inherit');
}
},
onScrollMove: function () {
if (this.y > 5 && !pullDownEl.className.match('flip')) {
pullDownEl.className = 'flip';
pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Release to refresh...';
$('#pullDown').css('display', 'inherit');
this.minScrollY = 0;
} else if (this.y < 5 && pullDownEl.className.match('flip')) {
pullDownEl.className = '';
pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Pull down to refresh...';
$('#pullDown').css('display', 'inherit');
this.minScrollY = -pullDownOffset;
}
},
onScrollEnd: function () {
if (pullDownEl.className.match('flip')) {
pullDownEl.className = 'loading';
pullDownEl.querySelector('.pullDownLabel').innerHTML = 'Loading...';
pullDownAction();
}
}
});
setTimeout(function () { document.getElementById('wrapper').style.left = '0'; }, 800);
}
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);
loading it with my other script in my header it works but now I'm using the jquery getScript. It loads the script (using firebug) but when I tried calling the functions inside my js file it give me a two errors
Cannot read property 'offsetHeight' of null
Cannot call method 'refresh' of undefined
This is how I call my js script using getScript
$(document).ready(function() {
$('.email').click(function (){
$.getScript("assets/js/scroll.js",function() {
pullDownAction();
loaded();
});
});
});
Help anyone
I know this may suggest more work than you want to do, but have you tried doing namespacing? I do not know if this works 100% (as i am not sure of the reasoning why that is not working for you), but have you tried this?
(function( PullDown, $, undefined ) {
//Private variables and this is a great way for minification, you will get the most out of it
var myScroll,pullDownEl, pullDownOffset, generatedCount = 0;
function pullDownAction () {
//... your stuff here
}
function loaded() {
//... more your stuff here
}
}(window.PullDown = window.PullDown || {}, jQuery) // avoids name space collision w/ jQuery
Now do the same things, but with this edit.
$(document).ready(function() {
$('.email').click(function (){
$.getScript("assets/js/scroll.js",function() {
window.PullDown.pullDownAction();
window.PullDown.loaded();
});
});
});
If i am not mistaken, or have bad copy and paste skills, this should work out just great!