image resize inside iframe inside iframe - c#

Basically we're using a service provided by gapphotos.com where by we can call there images into our site via an iframe. This iFrame then contains another iframe that holds the image. Problem I'm faced with is their images come in two sizes 161x161 or 320x320 roughly. All I want to do is go into these two iFrames with jQuery and alter the height/width.
var f = $('#iFramePic1');
f.load(function() {
var iF = f.contents().find('iframe');
iF.load(function() {
iF.contents().find('img').height(100);
});
});
This is the jQuery I'd used to try and attempt that but it comes back with the
Blocked a frame with origin "http://localhost:1506" from accessing a frame with
origin "http://www.gapphotos.com". Protocols, domains, and ports must match.
I've looked into EasyXDM but can't find suggestions to go 2 iFrames deep. Any help would be much appreciated as this is on a tight schedule.

That would be impossible, because the iFrame has another origin. The iFrame is not accessible, since cross domain iFrames could be easily missused for CrossSiteScripting
http://en.wikipedia.org/wiki/Same-origin_policy
i don't exacly know if this applies to css styles too, you might want to try and use a css to set your own height and width...

Related

Redirect the page with Height & width

i have a doubt that i can redirect the page , but can i put height and width there
response.redirect("Mypage.aspx");
for eg
response.redirect("Mypage.aspx",height="300px",width="200px");
i am doing this in asp.net, c#
You cannot open a page with this method, use javascript window.open instead.
ClientScript.RegisterStartupScript(this.Page.GetType(), "", "window.open('Mypage.aspx','mywindow','menubar=1,resizable=1,width=300,height=200');", true);
dude, you quite lost... I suggest you to understand the server side concept of web application first, otherwise the learning asp.net experience could be frustrating...
regarding your question, there is not such thing what you want to do, the display on the page is html format in the client side (applying style(for example) to html elements )
although you can map those html ui in the server side

WebPage Render Position Controller

First question but I really am in a jam.
I have a webpage render which is working perfectly. However, I need to be able to control the initial display position (almost like a href #anchors in HTML) but without any access to the site content.
From as far as i can see i have no access to the scrollBars other than the bool to enable / disable..
Is there anything i can do to even force a scroll down of 20% for example, and then I can create a form to adjust later on.
Any assistance would be HUGELY appreciated although from what I have researched it seems unlikely.
I have the regular windows WebBrowser Render
private System.Windows.Forms.WebBrowser m_webBrowser;
Thanks !
--This is for c# standalone application.. Not WebBased.
Have you tried using jquery?
I personally use the animate method from jquery to scroll to certain elemnts in my webpage.
Example:
$('html, body').animate({scrollTop: $('#the-element-you-want-to-scroll-to).offset().top}, 1000);
PS: For the last parameter you can control the time it will use to scroll to destination, that offering you a nice effect.(in milliseconds)
I managed to resolve it using a strange method..
I basically injected some javascript into the rendered HTML manually.. Then the rest was easy.
i used something like this :
string updatedSource = WebBrowser.DocumentText.Replace("Google", "Foogle");
string extraSource =
"<html><body>Script goes here <br/>" +
"<div><p>BLA BLA BLA</p></div></body></html>";
WebBrowser.DocumentText = extraSource + updatedSource;
WebBrowser.Update();
Maybe it will help someone.

taking a screenshot of some element in the html

So I was wondering, if I have a div which contains a maps of google maps rendered with some makers and I want to take a picture of that element how can I do this?.I found this solutions it's a approach of what I need but the problem it's that sending a url doesn't help me, I need the specific Div with all the markers. For the server side i'm using C# and for the cliente, asp.net with jquery. Also the google maps apiV3 to handle the maps
Take a look at the Canvas2Image library by Nihilogic Labs:
http://www.nihilogic.dk/labs/canvas2image/
Here's an example of how to take a screenshot of an element through JavaScript:
var oCanvas = document.getElementById("thecanvas");
Canvas2Image.saveAsPNG(oCanvas);
EDIT
You might also take a look at Html2Canvas and FlashCanvas too. I believe one of them has support for earlier browsers (those which don't support HTML5).
Use the method in the link you mentioned and crop the resulting image to the dimensions of your div. You can use myDiv.getBoundingClientRect() in JavaScript to get the dimensions of your div.
Using the WebBrowser control, you can manipulate the document using html or JavaScript to get the page in the state you need to take your screenshot.
Have you considered using the Google Maps Static API - this will render a map image, with markers on it, as a PNG.

Resize object tag to fit silverlight content

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;
}

How to grab the parent url from an iFrame using c#

My scenario is I have a page name UserMain.aspx and in this page I have 2 sections (ie2 IFrames). Now from one of the IFrame pages I want to get parentUrl (ie www.xyz/UserMain.aspx). I have tried the Request.url but it's giving the url of IFrame, how to get the parentUrl?
Both IFrame and parent pages are on same domain.
You could try using the following. I tried it in one of my solutions but it was not quite what I needed. Maybe it will help you
Request.UrlReferrer.OriginalString.ToString();
The different windows and iframes only exist in the browser, the server code has no means to navigate between them.
In clientscript you can access the URL of the parent window, given of course that the page and iframe is from the same domain:
var parentUrl = window.parent.location.href;
string UrlBrowser= Request.UrlReferrer.OriginalString;
you can do this through client-side script using window.parent.location.href. This works in case you have an iframe at first level inside a loaded page. If you have more levels of hierarchy, like iframe within iframe ... then you can use window.top.location.href.
window.top always gets you to the topmost parent window.

Categories