So, I'm running a small wordpress website which uses Livefyre comment system plugin. The website also uses Nicescroll, a plugin that makes your scroll bar 'cooler'. Now, whenever I try to create a space between letters inside the comment box, instead of a space, I get my window scrolled to the bottom of the page ( using Chrome ). I have tried various javascripts found on StackOverflow, without succes. I wanna mention that everytime I disable Nicescroll plugin, everything works perfectly.
What can I do to prevent my browser from scrolling to the bottom of the page when trying to use spacebar inside that specific textarea ? Also, I have a custom search box on my website, which apparently is not affected by nicescroll.
Well, you could just set the spacebarenabled option to false to disable scrolling via space bar at all (but users might expect that to work as it would with the normal scrollbar).
If that’s not an option, then you either have to get into the event handling this plugin uses and figure out a way to not have keypress events from textareas bubble up to where it catches them, or modify its event handling to have it check whether the target element of the event was a textarea or not before it scrolls.
Related
I am using Selenium 2 and Robot Framework to automate our application. I have used the below JavaScript code to scroll down the page but am not able to scroll.
I want to enter text inside the text box after scrolling down, but I am receiving the exception:
Element not visible
The text box is partially visible on the screen by default, if we manually scroll down than its completely visible, But selenium robot framework unable to scroll down.
I have tried:
Execute JavaScript window.scrollTo(0,200)
Execute JavaScript window.scrollBy(0,200)
Execute JavaScript window.scrollTo(0, document.body.scrollHeight)
How can I fix this?
Your scrolling code looks ok. However, I don't think scrolling is your problem. Element visibility is ok even if it is scrolled away from screen. Try this code for example. At least on Chrome page scrolls back up at Input Text keyword
*** Settings ***
Library Selenium2Library
*** Test Cases ***
Scroll
Open Browser http://www.stackoverflow.com/ Chrome
Execute JavaScript window.scrollTo(0, document.body.scrollHeight)
Input Text //*[#id="search"]/input robot framework
Sleep 3
Close All Browsers
I think you may have an incorrect locator for your edit box.
I fixed the issue with Execute JavaScript ${element}.scrollby(0,200). It will not work in every case. If the element is not in a viewport it will not scroll.
There's an efficient way to scroll the page to get the element to a view port.
If we are using Execute JavaScript Window.scroll(x,y), we need to specify a horizontal and vertical position, x,y, which is difficult to find and may not be accurate.
Instead we can use the following line of code,
Execute JavaScript window.document.evaluate("//xpathlocation", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue.scrollIntoView(true);
The above code will scroll the window and get the element specified in /xpathlocation to the view port.
Execute JavaScript window.scrollTo(1,500) works for me with Python2 ; you have just to put x <> 0 for exemple '1' otherwise it wont' scroll
You can use this as a keyword:
Execute Javascript $(document).scrollTop(${x})
Where,
x is the number in milliseconds to scroll down.
Have you tried in Selenium webdriver in the IPython console directly?
I have tried as in the following, and it is able to scroll down.
from selenium import webdriver
firefox = webdriver.Firefox()
firefox.get('http://twitter.com')
firefox.execute_script('window.scrollTo(0,200)')
If there is another element inside your page with scroll bar which you want to scroll into, you can use this Execute javascript command:
Execute Javascript document.querySelector('<div.css>').scrollTop = 200;
You can just change the '200' and increase it as you want to scroll down more.
i tried by pressing tab for number of times till I landed to my element..!
FOR ${i} IN RANGE ${Range}
Press Keys NONE TAB
END
i just ended up by pressing TAB key by required number of times, choose an element and press TAB key
Click Element ${Element}
FOR ${i} IN RANGE ${Range}// you can even provide number
Press Keys NONE TAB
END
I have tried the following it worked for me
Fill in the required info
input text id:userName Joe Biden
input text id:userEmail Joe#att.net
input text id:currentAddress 211 Madison Ave NY
execute javascript window.scrollTo(0,200)
scroll element into view id:submit
you will need to select the window before scrolling
Okay, so this is a bit of an odd question. Facebook is trying to remove the feature that hides your profile from search, but requires you hit an accept button before they can remove it. I like my privacy, so instead I just used ABP to hide the dialog box and give me back access to the page. The problem is that scrolling has been disabled, so while I can interact with the content that's currently visible, I can't scroll down. Is there a way to inject HTML or JS that would force-enable scrolling?
Seems as a job for greasemonkey
https://addons.mozilla.org/sv-se/firefox/addon/greasemonkey/
There are similar plugins for other browsers, Chrome have support for users scripts by default but there is a great addon there as well
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo
Internet Explorer can also offer this by adding Trixie
http://trixie.softpedia.com/
If you don't need it all the time and don't want to go to the effort of making a script you could just edit the html directly using either the developer tools built in to most browsers and inspecting the element.
Just right click what you want to change and select inspect element.
Adam
I've been playing around with the Padilicious touch events script after researching a problem I'm seeing in my code. I am able to recreate my own issues with the Padilicious script. I'm simply adding a form with an input to this example provided on the Padilicious site.
When I load this up on an iPad or on an iPhone emulator on a Mac, I'm unable to gain focus on the textbox. In my code, this has the same effect by blocking access to divs and other controls in the site's content. It's as if the div containing the ontouch events is masking everything else inside it.
Here is a jsfiddle showing what I've added. http://jsfiddle.net/Da8yj/
How can I impliment this swiping functionality and also keep the current functionality of my other controls?
I have a few questions in mind...
I want to disable right click on my webpage so that noone can alter
the source code
I want to disable the addressBar as well
I wish to resize it to a particular size in the bottom right of my
screen & with a text area so that when ever I click the button
inside that webpage all the contents in that text box should be
copied
I tried experimenting but it doesn't seem to work, javascript maybe has some issues.
I wan't it purely on javascript & HTML (Can't use php/asp), want it to work on IE only, dont care about other browsers....
1) I wasnt to dis able right click on my webpage so that no one can
alter the source code
Regardless of browser hackery employed, the user will always be able to view your source. Nobody will ever be able to alter the source code on your server (short of the server being hacked or a vulnerability in your code is found). But, using Firebug (or similar), anyone can change client-side script, CSS and/or HTML.
2)I want to disable the addressBar as well
You can't just gain full access of a browser. That would get annoying pretty quickly (think about the potential browser-inducing epilepsy if every site had control over your root browser and did different things to it). One thing that you could do is have your site create a popup window that is set to a specific size with specific attributes (hiding the address bar, etc). Note that you may annoy users with this as you'll have to deal with popup blockers and such.
3)I wish to resize it to a particular size in the bottom right of my
screen & with a text area so that when ever I click the button inside
that webpage all the contents in that text box should be copied
I have no idea what this means.
Was this post a troll?
You can't disable the address bar with JavaScript.
However you can disable right click. Note: Anyone with enough technical background to know what to do with the source code would know enough to just disable JavaScript to get their right click working.
Here's a demo with source code to disable right click.
Demian's answer has some good insight on what you're asking, I strongly suggest you rethink what you're doing.
I have I'm using the dsmoothmenu jquery plugin to generate a toolbar on the top of my page -- About a month ago, the page started loading (most of the time) with the first item of the menu bar exposed -- as if the user were hovering over the item. I've spent hours trying to figure out what's causing this and haven't made any progress.
I have another page which uses the same exact markup for the menu, and the same dsmoothmenu js/css, but which doesn't exhibit the aforementioned behavior. So I figure it's got somehting to do with perhaps a meta tag, or a style that's being overwritten. By investigating with the inspector, it seems as though the ul#other_cities element is being given display:block by something, which is overriding the default style of display:none, which should be active until the user hovers over the element.
Here's an an example of the problem: http://www.foodtrucksmap.com/la/
And a working example: http://www.foodtrucksmap.com/iphone.html
EDIT: So I've found that the problem will only manifest itself if the mouse is OUTSIDE of the window when the page finishes loaded. If you keep the mouse hovering over the page, the menu bar will not slide down. This along with the fact that it only seems to happen in chrome, leaves me really confused.
I can see your problem in Chrome when I right-click the link and then "Open link in new tab" or " ... new window" which opens the window in the background. This leaves me with this conclusion.
Google's Chrome, for some weird reason, positions a "virtual" pointer at position top:1, left:1 which triggers the script. As soon as we bring in the actual "physical" pointer this position takes over and the problem is gone.
As this seems to be a problem with Chrome we can prevent this only with a little trick. I'd say we give the main div#wrapper some breathing room to the left with a margin? Or maybe something to the top like the second example which works!!!
So far I've been able to find out that the onMouseOver event actually fires when the page is loaded.
Since I don't have direct access to the JS files search for the word 'trigger' in all the file (not the jquery ones) and try to find out if it might be calling that at any point.
I will do more research when I have time.
If Nicklas is correct and hover is for some reason firing onload, try wrapping the js of the hover function in your menu javascript with the following conditional:
if(event.target == this) { //Check if the hover event actually targets the object.
//Hover Code//
}
Hope this helps!