I have stucked somewhere please have a look and get back to me if you have some idea on that:
I want to open a page in fancybox and url of page which is opened in fancybox should display in address bar. I dont want to display url with http://abc.com#divid it should be a proper url without #divid.
It should be something like that :
http://exanple.com/title1
here is my html code:
<a id="example1" href="general.php">Recent Trip to New York</a>
jQuery code:
$("a#example1").fancybox();
Is there any way I can implement the things like I have mentioned..
URL in the browser can be manipulated with HTML5 history, but in this case it would not be advised as the user is simply viewing another page via an iframe, and they remain on the parent page.
Mozilla Developers: Manipulating The Browser History
Related
I'm very familiar with php/js/ajax, but I'm a little confused as to how to pass the popup link to the address bar.
Basically I have a custom jquery popup. Let's say I click on a link that loads the popup, I want to pass parameters to the address bar so that it reads out the address of whatever I want.
So let's say my page that contains the videos with the links is:
mydomain.com/videos/index.php
and when a video is clicked I want it to read the following in the address bar:
mydomain.com/video/youtubeid
I actually have it all set up to work on the video page if they were to come back to that link. I don't want a popup to come up obviously. The popup links page is like /video/video_pop.php
How would I go about doing this? Is there some way to change the address bar? Is this a htaccess rewrite thing?
Thanks!
You can use the Javascript history API to change the address in the address bar without reloading the page. Mozilla provides instructions at https://developer.mozilla.org/en-US/docs/Web/API/History_API
http://fb.9nty.com/?t=Outrage+ShopRite&l=www.learnmoreng.com/forum2_theme_111582910.xhtml?tema=79
I use a Facebook share plugin to share links, but after links is shared and been click upon, the browser opens the page ignoring ?tema=79
Is there any ways to help?
I would want to use this: http://fb.9nty.com/?t=Outrage+ShopRite&l=www.learnmoreng.com/forum2_theme_111582910.xhtml&tema=79
And implementing a code that automatically changes &tema to ?tema and reloads the page
url encode the link (the part after &l=) - so the share link becomes:
http://fb.9nty.com/?t=Outrage+ShopRite&l=www.learnmoreng.com%2Fforum2_theme_111582910.xhtml%3Ftema%3D79
I am currently developing a website using bootstrap, I am using the bootstrap tabs feature to navigate between pages without loading any other html files, but I am also trying to allow URLs to point to certain pages, here is my issue..
I can set the URL to go to the said page using
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
}
But this won't show any of the content which is on the page unless you navigate out of the page and back in, basically if I put text in that tab, it wouldn't show, but if I opened another tab, and then went back in to the page I linked to it would work fine.
Here is a link to what I'm working on: http://xuz.co/dev/takistanmain/
Navigating pages works, but when I use a url like http://xuz.co/dev/takistanmain/#about it will show a blank page as you can see.
Let me know if you need anymore info and I thank you for your assistance!
I am making a simple online application.
I have a navigation bar with a few buttons and one "div" into which all the new contents will be loaded dynamically i.e. when I click "About", it will load the page parts into the "div" without reloading the whole page with .load() function. The problem is:
what if I need to give a link to the Documents section of my web site, or the user wants to store this kind of link, the url is not rewritten when browsing my site. when the user stores the default link it will always link him to the default "Home" part.
How can I rewrite the URL and what is the most correct way to do this?
As option you can use location.hash.
E.g. user clicks About
and you're loading the content of your "About" page.
Also the URL in browser's address bar will be changed to something like http://mysite.com/hello.jsp#about.
So now user can copy this URL and visit it.
Then in $(document).ready() you can check the location.hash, find that '#about' anchor in it and then load an appropriate content.
Another option is to use Backbone.js or any other JavaScript MVC framework that you like which will help you to build rich client-side application and will handle such things for you.
According to me, appropriate method is to update the hash of the URL. Something like example.com/#About and etc. People can bookmark these. You have to take care to make a AJAX call when you read a hash tag in the URL and load the respective page.
What I would do is make ajax call on hashchange event instead of click. This event is supported from IE8 to all modern browsers. If you want to support IE7 use the hashchange plugin by Ben Alman.
I am trying to get this functionality going but am a bit uncertain and don't know how to approach it. I have a master page with a div called "masterDiv". 'masterDiv' makes a load() call and loads content of an external html page called "details.html" from it content div. This is how I am doing it:
$('#masterDiv').load('details.html #content');
content loads up as expected and the url address pops in as "http://www.xyz.com#details"
This is all good and working, but then I thought of those users who may not have JavaScript endabled. I figure I would just direct those users to 'details.html' page directly instead of having the "Master Page" load the content from "details.html" page. So now here is the issue, lets say if I send a user this link:
http://wwww.xyz.com#details
And if that user's browser doesn't have Javascript enabled then obviously JQuery cannot be invoked and therefore load() call will not be made and so on. how can I direct the user to "details.html" page directly, please?
Any insight would be wonderful
Thank you.
Your link probably looks like this :
<a id="myLink" href="#details">Link that the user clicks</a>
When the user clicks the link, jQuery load is called. Is that correct?
If so, you could instead have your link like this :
<a id="myLink" href="http://wwww.xyz.com/details.html">Link that the user clicks</a>
That way, when the page loads, the link will work for everyone (even those with javascript disabled). Then, when the page first loads :
$(document).ready(function() {
$('#myLink').attr('href', '#details');
});
will set the link to the way it was before. That way, only users with Javascript enabled will use the load version. The other ones will simply be redirected to details.html
If there is something I haven't understood correctly in the question let me know.
how can I direct the user to "details.html" page directly, please?
By making the link's href attribute "details.html". The way every link works by default.
Details
Every link on your site should be built this way. That is how the Internet is designed to work, and how it works best. You should only add functionality with JavaScript if you actually need to, you shouldn't be depending on it for something as fundamental as linking between pages.