I am developing a browser app for Windows Phone 8. I want to detect the scroll position, so that I can show the address bar only when user is at top of the page. I also want to restore the current scroll position after a page refresh.
I cannot inject javascript into the page because obviously the content is from all over the web.
So far I am able to determine if user is scrolling up or down based on this idea.
If I can inject javascript, I probably could use InvokeScript and detect if page scroll is at the very top
window.onscroll = function(ev)
{
var B= document.body; //IE 'quirks'
var D= document.documentElement; //IE with doctype
D= (D.clientHeight)? D: B;
if (D.scrollTop == 0)
{
alert("top");
}
};
DEMO
So I wonder if anyone has any suggestion to achieve this. Thanks.
EDIT
Is it possible to use IFRAME and place my javascript there while the external websites are loaded inside the IFRAME?
Related
as the title say, I would like to disable client from dragging or sliding out an element into a c# winforms webview to the desktop.
This will avoid the client from making an icon on desktop to the current page link.
Is it possible to disable this?
Insert a piece of JS code into the page:
document.ondragstart = function () { return false; };
So here is the scenario, using CefSharp in a WinForms application.
We have two pieces of information a page url and a link url within that page.
We want to load the page - easily done, and have CefSharp show the area of the page where the link is located. That is cefsharp automatically scrolls to the right location on the page where that link is within the DOM.
What is the easiest way of doing that?
Not sure which version you're using, I was able to solve this using the latest stable version of CefSharp (47.0.0).
First add a handler to the FrameLoadEnd event:
browser.FrameLoadEnd += OnBrowserFrameLoadEnd;
The handler is the following:
private void OnBrowserFrameLoadEnd(object sender, FrameLoadEndEventArgs frameLoadEndEventArgs)
{
if (frameLoadEndEventArgs.Frame.IsMain && frameLoadEndEventArgs.Url == pageUrl)
{
frameLoadEndEventArgs.Browser.MainFrame.ExecuteJavaScriptAsync(
"(function() { var el = document.querySelector('a[href=\"" + linkUrl +
"\"]'); if(el) { el.scrollIntoView(); } })();");
}
}
The two constants are:
private const string pageUrl = "http://stackoverflow.com/";
private const string linkUrl = "http://stackexchange.com/legal";
Whenever we navigate to the site in the pageUrl, we invoke a JavaScript function in the loaded document. It selects the first element which has an href attribute equal to the linkUrl using querySelector. If there is an element like that, then we invoke the scrollIntoView() method on it.
This particular example scrolls the following link into view when you visit stackoverflow.com.
I used the CefSharp Minimal Example as a starting point to build my POC.
I uploaded it HERE for inspection.
Rebuild the project, package restore is enabled, so it should get all the necessary packages. After that you can run it. Enter stackoverflow.com into the address bar, hit Enter, and when it's loaded, the view should scroll down.
I am using Webview to displays an html page that contains 2 inputs of type text and a submit button.I want the app user to be able to fill these fields on the app before launching the webview.Therefore taking the user directly to the result of the search.
Apparently the webview.Document is no longer available.
Any suggestion ?
Once the HTML is loaded into WebView, you can call a method called InvokeScriptAsync through which you can invoke some kind of Javascript.
await myWebView.InvokeScriptAsync("eval", new string[] { "var elem = document.forms[0].submit();"});
This way you can fill the input field, click a button or whatever you need.
I am developing a windows phone 7.1 application, which will search through different search engine after taking in the text from the textbox. I have textbox(searchBox), four buttons for bing, google, facebook and yahoo and a web browser control. Now i need to pass the text from the textbox to the web browser. But the thing is it should be of the form "www.bing.com?q= textbox.text". how can i implement this?
You can adjust WebBrowser.Url property
Link : http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.url.aspx
Or you can use Navigate method
var address = "www.bing.com?q=" + textbox.Text;
webBrowser1.Navigate(new Uri(address));
Link : http://msdn.microsoft.com/en-us/library/ms161352.aspx
I am having the following problem:
I have a web page hosting silverlight content. The silverlight content is navigation aware, so it will always be the same html page and the same silverlight control. The content however will of course change when the user is navigating from one page inside the control to another.
Different pages have different size requirements and in some cases the final height of the content is unknown because the content is coming from a web service.
I want the height of the silverlight content to be dynamically according to what it actually needs. I saw many solutions to make the silverlight control fit the browser window, but I want the silverlight content to only have the actual height it needs and overflow when necessary, so that I can use the browsers scrollbars.
The page should also have a static background image, which is giving me some problems when the object tag is not exactly the size of the silverlight content.
The effect I want to achieve is more or less like in this web page:
http://www.codegarden.de/
The background should be in the html page when possible and the silverlight control should be the content in the middle part and should scroll with the browser scrollbar.
Can anyone help me? Thanks!
You can have your silverlight application execute javascript commands on the hosting page, that will in turn set the size of the <Object> tag.
Something like that:
using System.Windows.Browser;
// set a global variable
HtmlPage.Window.Eval(String.Format("setSilverlightObjSize({0},{1});",newW,newH));
where setSilverlightObjSize is a javascript function you wrote in the hosting page.
soemthing like:
function SetObjectTagProps(w,h)
{
var obj = document.getElementById("silverlightObj");
obj.width = w;
obj.height = h;
}