I am using below function to scroll. It is working in all webpages but one. Webpage having long list it is not working. Please suggest alternative way
function Common() {
this.scrollPage = function (element) {
browser.executeScript("arguments[0].scrollIntoView();", element)
.then(function () {
})
}
}
A similar code to what you've tried worked for me. Try with this:
return browser.executeScript('arguments[0].scrollIntoView(true)', element.getWebElement());
I am using jQuery-waypoints and the infinite shortcut to load listings on my page. I have this all working and am trying to comply with Google's Guidelines on this by using pushState() to alter the browsers history. This is all working fine using this.
if ($('#list-col.active .list-col-content').length > 0 && !wayPoints) {
initWaypoint();
}
;
function initWaypoint() {
let infinite = new Waypoint.Infinite({
element: $('#list-col.active .list-col-content'),
offset: function () {
return this.context.innerHeight() - this.adapter.outerHeight() + 2000
},
onAfterPageLoad: function (direction) {
var last = $('.page-loaded:last');
last.waypoint(function (direction) {
if (direction == 'down') {
if (window[window.GoogleAnalyticsObject]) {
ga('set', 'page', last.data('url'));
ga('send', 'pageview');
console.log('pageview ' + last.data('url'));
}
history.pushState('', last.data('title'), last.data('url'));
} else {
history.pushState('', last.data('prev_title'), last.data('prev_url'));
}
})
}
});
wayPoints = true;
};
Here is my issue/questions.
The new browser's URL is now https://www.example.com/listingpage?page=15. Per Google's Guidelines, that "component page" needs to load content with page 15's listings, and only page 15's content. No problem, I can do that. But now I have an issue with the content BEFORE page 15.
I now need to scroll up, loading more content (now above the existing content) as the user scrolls up.
I am at a loss on how to add a second infinite (really finite since it is loading down to 0) scroller that loads pages as you scroll up the page.
I know I am not the first to encounter this so any help or direction would be appreciated.
No responses in several days so I researched and found an answer on my own. Posting some info here in case anyone else has same issue with infinite scrolling in both directions.
Best solution I found was on Google's Infinite Scroll search-friendly recommendations. That pages lists an infinite scroll with pagination demo. I had to do some modification for my specific use, but it is a great example and obviously following Google's recommendation is a good way to go.
Hope this helps someone.
I trying to learn SmartFace App Development Platform. I added a SliderDrawer in Page then after I added codes as follows. But this codes not working in OnShow() event. How can I do this? Maybe I can do with write a lot of code. But I want to do without writing a lot of code.
function Page1_Self_OnShow() {
Pages.Page1.SliderDrawer1.show();
}
This is a known issue for Android, it will be fixed.But you can solve the problem until the bug is fixed as follows:
function Page1_Self_OnShow() {
var timeoutID = setTimeout(function () {
setHello();
}, 200);
function setHello() {
Pages.Page1.SliderDrawer1.show();
}
function cancelHello() {
clearTimeout(timeoutID);
}
}
I'm making a mobile-app using Phonegap and HTML. Now I'm using the google maps/places autocomplete feature. The problem is: if I run it in my browser on my computer everything works fine and I choose a suggestion to use out of the autocomplete list - if I deploy it on my mobile I still get suggestions but I'm not able to tap one. It seems the "suggestion-overlay" is just ignored and I can tap on the page. Is there a possibility to put focus on the list of suggestions or something that way ?
Hope someone can help me. Thanks in advance.
There is indeed a conflict with FastClick and PAC. I found that I needed to add the needsclick class to both the pac-item and all its children.
$(document).on({
'DOMNodeInserted': function() {
$('.pac-item, .pac-item span', this).addClass('needsclick');
}
}, '.pac-container');
There is currently a pull request on github, but this hasn't been merged yet.
However, you can simply use this patched version of fastclick.
The patch adds the excludeNode option which let's you exclude DOM nodes handled by fastclick via regex. This is how I used it to make google autocomplete work with fastclick:
FastClick.attach(document.body, {
excludeNode: '^pac-'
});
This reply may be too late. But might be helpful for others.
I had the same issue and after debugging for hours, I found out this issue was because of adding "FastClick" library. After removing this, it worked as usual.
So for having fastClick and google suggestions, I have added this code in geo autocomplete
jQuery.fn.addGeoComplete = function(e){
var input = this;
$(input).attr("autocomplete" , "off");
var id = input.attr("id");
$(input).on("keypress", function(e){
var input = this;
var defaultBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(37.2555, -121.9245),
new google.maps.LatLng(37.2555, -121.9245));
var options = {
bounds: defaultBounds,
mapkey: "xxx"
};
//Fix for fastclick issue
var g_autocomplete = $("body > .pac-container").filter(":visible");
g_autocomplete.bind('DOMNodeInserted DOMNodeRemoved', function(event) {
$(".pac-item", this).addClass("needsclick");
});
//End of fix
autocomplete = new google.maps.places.Autocomplete(document.getElementById(id), options);
google.maps.event.addListener(autocomplete, 'place_changed', function() {
//Handle place selection
});
});
}
if you are using Framework 7, it has a custom implementation of FastClicks. Instead of the needsclick class, F7 has no-fastclick. The function below is how it is implemented in F7:
function targetNeedsFastClick(el) {
var $el = $(el);
if (el.nodeName.toLowerCase() === 'input' && el.type === 'file') return false;
if ($el.hasClass('no-fastclick') || $el.parents('.no-fastclick').length > 0) return false;
return true;
}
So as suggested in other comments, you will only have to add the .no-fastclick class to .pac-item and in all its children
I was having the same problem,
I realized what the problem was that probably the focusout event of pac-container happens before the tap event of the pac-item (only in phonegap built-in browser).
The only way I could solve this, is to add padding-bottom to the input when it is focused and change the top attribute of the pac-container, so that the pac-container resides within the borders of the input.
Therefore when user clicks on item in list the focusout event is not fired.
It's dirty, but it works
worked perfectly for me :
$(document).on({
'DOMNodeInserted': function() {
$('.pac-item, .pac-item span', this).addClass('needsclick');
}
}, '.pac-container');
Configuration: Cordova / iOS iphone 5
I need help desesperately, it's been a week since I'm stuck trying to resolve this problem, I call FB.ui in FireFox and Chrome without any problem, but when I try with IE it doesn't appear the Facebook dialog. Actually the code is like this:
function inviteFriends(myMessage) {
var obj = {
method: 'apprequests',
message: myMessage,
icon: 'http://www.mywebsite.com/logo.jpg',
data: 'tracking information for the user'
};
FB.ui(obj, callbackInvite);
}
var callbackInvite = function(response) {
document["flashContent"].InvitedFriends(response);
}
Please, any help will be welcomed
Might try this out:
displayMode = "popup";
Looks like there's a bug with IE and FB.ui
http://bugs.developers.facebook.net/show_bug.cgi?id=17565