I have an iframe on my site that shows the full contents of an external site. I want to get rid of the iframe but keep the same functionality. I was thinking of using a div with overflow=auto. Problem is, when I attempt to include an external site using php, such as include 'http://www.site.com'; or echo file_get_contents("http://www.site.com");, the site shows up but it takes over formatting, the site's name appears in the titlebar, etc. How might I replace the iframe functionality?
How might I replace the iframe functionality?
This is not easily possible. You run into the problems you just described and to solve those is a real hard job. I don't know of an existing component that does this.
Instead stick to the iframe. What's so bad about it?
If you are getting rid of the iframe because of its default ugly border then you can just make the iframe look seamless using the 'seamless' attribute of iframe
http://www.w3schools.com/html5/att_iframe_seamless.asp
Related
I want to achieve something like Facebook, where the top bar stays there and only the content underneath it changes for different pages. At the same time the URL at the top also changes, for example /messages or /events.
I'm not completely sure if this is how Facebook works but I'm trying to achieve something like this... Right now I can't figure out how this could be done...
Does anyone know how this could be achieved or if there is a name for it?
You could do this with a fixed header that is on all of your current pages, so that whenever a new page loads it appears the header is still there, or you could do the more complex way of putting all your pages in separate divs on one page, and hiding/showing the appropriate divs when a link is clicked. I'd recommend the first way personally, but those are some options.
I'm sure there are other ways to go about this.
If that isn't what you want then I apologize.
Edit: Also, my first suggestion will load a whole new page, so if you want the seamless transition effect then the second option will be the better route to go
Templates perhaps? You can't change urls without navigating to a different page as far as I know. If you want consistent elements on the page with varying content that basically is the function of templates.
If you're looking for dynamic elements to show up on the page then you should look into AJAX and DOM manipulation. jQuery is the defacto library to help with both of those. Take a look at http://api.jquery.com/ and maybe search for a template engine. Most web frameworks include a template system to create consistent styles and allow code reuse.
You can use #anchors, that won't reload the page. For newer browsers, you can use https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history to update the url without reloading the page
Currently, I have an embed source that autostarts by default, and is hidden.
I needt a control via an Tag to stop the embed from playing without removing "?ID=(number) from the URL.
My thoughts are to disable autostart and reload the page somehow.
I know that it's not possible to change an embed's properties and have it work with JQuery (at least last I knew), so it would probably mean looking for a way to use javascript to refresh the page and change the autostart property somehow (don't know how), but maybe there's a more efficient way to do it, anyhow?
Another idea I had was to include the embed source in a hidden IFrame, and just change the source of the IFrame when link is hit, so no queries are needed, but would that be more or less effecient?
I've done some looking around for a few more hours, and I decided to place the embed in a div tag, then used
<SCRIPT>function pStop() {document.getElementById('playstat').innerHTML = '';}
Worked like a charm. :)
As many of you have noticed, when you hit a link to switch from page to page in Google+ or facebook, the URL changes, the body changes but some parts of the page don't, like the chatbox. I believe AJAX can change a specific content of the page by requesting a PHP page from the server and get some results, but that won't change the URL.
Actually, I didn't know exactly how to search that in Google, so, any keywords/names/linkes will be strongly appreciated.
I'm using JQuery library for Javascript and Symfony2 framework for PHP, if this helps.
Look at the JQUERY load method.
http://api.jquery.com/load/
All you need to do is use a selector:
$('mydiv').load('newcontent');
Very powerful function. Look it up!
edit:
Sorry missed that url change. The trick alot of times with the URL is around the Hashtag. If you look closely at the URL there will be a "#" pound symbol in there somewhere. This allows the site to store current state without a reload.
Currently there is no way to change the URL in the browser save for the bit after the hashtag with out fully reloading the site.
you can either use iframe or ajax to keep some part of your page static.To change url either you can use hash hack.
window.location.hash = "pageidentifier"
or you can use the html 5 trick described in the url provided by arxanas
I want my site to have similar navigation to a browser. I want visitors to be able to right click on one of my links/articles and have the option to open a new tab and have the page load in the same page. Here is the concept site I want to work with link.
Well, then try to use dynamically injected <iframe>. Especially when using JQuery it could be very easy solution. You must also somehow manipulate the links inside the content... look at this link if it helps, hope you won't have problems with "same origin policy".
You have to use some ajax function to load content from the new page into the tab.
Sounds like this would be a good scenario to use a AJAX, for ease of use I would recommend JQuery.
How to hide an iframe url in HTML source code.I have two applications one applications get an url of another application into its iFrame,so that it displays in its source code.I dont want to display another application url in the source code.
I think you would need to set the IFRAME URL via JavaScript. The Javascript could then be Obfuscated, so that the URL would not be in plain text... Please see the following link for the obfuscator:
http://www.javascriptobfuscator.com/Default.aspx
i.e. if it was jQuery...
$("#myiFrame").attr('src','http://www.google.com');
becomes:
var _0xc1cb=["\x73\x72\x63","\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x67\x6F\x6F\x67\x6C\x65\x2E\x63\x6F\x6D","\x61\x74\x74\x72","\x23\x6D\x79\x69\x46\x72\x61\x6D\x65"];$(_0xc1cb[3])[_0xc1cb[2]](_0xc1cb[0],_0xc1cb[1]);
You can't hide it per say, but you can run it through something like TinyURL so that anyone interested would need to go an extra step. Anyway, that's the only thing I can think of. However, if you are displaying that page in a frame, what's the harm in having the URL in the source code? There really isn't a good, foolproof way to prevent someone determined from finding out the location of that iframe page.
You can create a php script which uses curl to call the url through localhost, then use this script as your iframe source.
If you have an issue with relative links and sub-directories, you can put your curl script inside the sub-directory.