I can set the background color of the current page using:
document.body.style.background='red';
Is there any way I can set the color of a page from another page?
Note: I can set the color when a page contains frames. In this case, consider the scenario similar to two different tabs of a browser.
Yes, providing:
You have a reference to the other page (such as the return value of window.open)
The page is on the same origin
Then just use said reference.
John K's comment is a good solution. If you're loading the other page synchronously (ie full page load, not AJAX) then obviously you're going to have to maintain the state between pages. The very nature of HTTP is pretty stateless, so a query-string is a nice simple solution for persisting data such as a background colour.
If you are trying to set apge background color using javascript, you can document.body.style.backgroundColor in your js code.
And if you want to set the bgcolor of a page from another page you need to use query string and pass the color in a variable to the other page and set the other page background color using that variable value on page load or whatever way you want.
seems only if you have opener.
Related
I have a anchor tag. For the first time(color deep blue link) when I click it, it redirects me to my dynamic graph which forms a curve, you can see the curve being rendered.
But when for the second time when I click the anchor tag(pale pink color), it redirects me to the same dynamic graph but the graph is already loaded/rendered, you don't see the curve being rendered.
Can I solve this problem, as I always want the link and graph react as if its always rendered for the first time
How to solve this by either using JavaScript or PHP.
Thanks in advance.
Image showing link has already been visited
If you have issue with just colour of the link then you can change the colour in css
a:visited{
color: ' #00008B'
}
For re-rendering the links on map . Try clearing cache because browsers stores cache of the all websites that you have visited. This answer talks about how programmatically empty browser cache.
You could trick the browser by changing the URL everytime by adding a random parameter. You may name it totally different if you like.
printf('Visit my graph', microtime(true));
So the URL looks like different on every call and won't get the cache hit, because it is not the same.
Visit my graph
Visit my graph
I don't know how to change a div's class by using JS on an other page. To specify, it will be like the class on page-A should change depending the JS changes on page-B.
(If you click on a box in page-B, the content on page-A should change.)
You can only amend the DOM of the page which is currently loaded. If you want to change a different page based on an action in a previous one you'd need to persist the state of the user's interactions and then amend the other page when it loads. To do that you can use localStorage, sessionStorage, session, cookies, or AJAX to store information on the server.
I have created two buttons and I am able to change my stylesheet once I click on these buttons. However when I go to the next page on my website the stylesheet reverts back to the original and does not stay how the user set it. I was wondering how this would be tackled...
Store preferred style in a cookie or localStorage.
If you use a cookie then you can set proper one at server which would prevent style flash.
Alternatively use script when page loads to read cookie or localStorage and append preferred stylesheet to <head> accordingly
Both methods are easy to research
I am creating a page that lets the user chose colours and various elements on the page will adopt the new colour. For example boxes to show the colour scheme selected. I've been using the code $('').css('background_colour',.....) and it works great.
The problem I have now is I made an example webpage which should use these various colours in the relevant sections of the page. For example, main text, background colour, etc. I can't use what I have been doing because none of the changes save and when I click the link that opens the example page it only shows the original colours I put in its CSS file. I figured the method I'm using doesn't isn't actually rewritting the CSS file because when I reload the page where the user selects colours every goes back to default.
If anyone can point me to places to read or suggest the best approach to changing the CSS file that is for a different page AND allows for those changes to be saved I would really help me out.
Hope my description makes sense
Thanks
You can use either cookies or html5 localstorage to store client preferences for your website.
It's plenty of different libraries on the Internet which can help you in this task.
Cookies libraries
https://code.google.com/p/cookies/
https://github.com/ScottHamper/Cookies
Localstorage library
http://www.jstorage.info/
I would suggest cookies if you need to read user preferences from your server side.
Otherwise you can go for localstorage.
if you want to use colors in relevant pages, you have to save your color change events in database or in sessions or in cookies.
Otherwise you can not save changes. Because web page is rendered again when you refresh the page.
I am looking for a way to display a list of websites one at a time from a URL list. I'm fine with a very manual solution, I found an AJAX solution where each "page" is displayed in a tab but it is very heavy because if I have 50 pages I want users to page through one at a time, this solution essentially pulls all 50 pages onto the one page. Do you know of a framework which does the same thing but only loads one page at a time? Thank you very much for the advice and help. Here is the site I found - http://css-tricks.com/jquery-ui-tabs-with-nextprevious/
You could load the URLs into an array and then create a 'next' button that loads the next url into a div; replacing the previous one.
do you require doing this will javascript?
might be easier to curl the pages using php, then echo this returned data as an eval-able array into the html. Then allow user to alter which part of the returned array you are looking at using a next and prev button.
if you pre-load each one it will be heavy as you have noted.
This idea is screaming for AJAX. With proper AJAX calls, you would only load a page once it has actually been selected by tab. Any previous page loaded into the area would need to be dumped. You shouldn't actually need to physically switch tabs if you're using the src attribute of an iframe, simply changing the src and forcing it to refresh itself should accomplish the trick. If you are performing a screen scrape through a remote web service, then you could simply use jQuery/AJAX to rewrite the innerHTML of the panel in question.