My question is similar to
Load webpage with modified css?
but with a few more limitations.
I'm trying to direct to one of links from my company and I have no server access to it. But my supervisor wants me to use that page and just add the css to it. I've researched around and only found two solution-ish methods. One is to fetch the page and just copy it (which is just simply making my own page). Or install a browser plugin that lets me modify it, but that only changes the website on my browser.
So is it possible to create a link that directs to a specific website and automatically mods the css with javascript?
I mean I'm not affecting the website itself. It just changes the appearance for anyone who goes through my link
Related
Sorry for the naivety in the question. explaining it here.
so i used this sample electron app from this repo:
https://github.com/crilleengvall/electron-tutorial-app
here he used html5 template to navigate within the browser window,
explained here: https://www.christianengvall.se/electron-app-navigation/
on the welcome page/section, i want to create a button, which loads another html file but in the section, not like filling up the whole browser window because i will still need the side bar panel for navigation.
somewhat like this:
also, is it possible to add a option in the menu where we can show/hide any new browser window created?
i would be obliged to give more details if i didnt make myself clear.
I am making a website for my friends band. I would like to know if its possible (apart from using Ajax) to keep audio playing after clicking on a link to another page on the site?
I currently have it set up using Ajax to reload the content, but I am having a few issues with it, and I'd rather not deal with the bother unless I really have to.
If not possible, is there a way to minimise the disruption (pausing then playing again) while navigating? It would be possible for the new page to continue playing the track from where the last page stopped, but I would like to minimise the pause. Or, on this subject, is it possible to keep certain page elements loaded after changing the URL (without using # urls), like facebook does (as in, you click on it, but the banner never disappears during loading)
Thanks for any help :)
Use Ajax to load content and History API’s pushState() to alter URL without page reload.
For consistent behavior across browsers, consider using a wrapper library like History.js.
Sites like Facebook use JavaScript/AJAX for these kind of things. If you don't want to use it, you can use frames (not recommended). Divide the page in two frames: the player and the website itself. This way you can easily turn it off too, just open the site without frames.
Good luck!
Of course you could also pop up the player in another window/tab.
(For now) It won't be possible without frames or javascript.
It might be troublesome to implement it differently than via AJAX, however you can either use IFrames, where the music would be played in the main one and the content is displayed in the child on or you can always make it a Flash webpage.
Build it in Wordpress and use the AnythingSlider plugin to have the pages shift within the main page. This way you can have tabbed navigation and never leave the actual page. No need to write too much code. The AnythingSlider uses html for the slides.
You can also not use wordpress and just use the AnythingSlider code.
http://css-tricks.com/anythingslider-jquery-plugin/
and
http://wordpress.org/extend/plugins/anythingslider-for-wordpress/
and
http://css-tricks.com/examples/AnythingSlider/
Is there an application that allows me to select a section of a web page, and then outputs all js used there? I've been told I can do this with Chrome Inspector, but haven't had any success so far.
Example:
On this page - http://preview.oklerthemes.com/porto/2.7.0/page-left-sidebar.html - there is a tabbed box in the sidebar. I want to easily grab all the JS/CSS needed for that box. I usually use Inspector to look at all the styles, and go and grab theme from each CSS file, but I don't know how to do this for the JS.
It's not quite clear from your question what you're asking.
Are you trying to see what JS causes writes or changes to a particular part of a web page? The easiest way would be to open the page with the element inspector, right-click a particular chunk of HTML and stick a breakpoint on modifications.
The next time a function causes any changes, the breakpoint will trigger and you'll be able to crawl up the call stack to see what the cause was.
I'm developing a system, which supports CSS themes. It's Ok so far, I can change the theme as desired, but the system is composed by two parts:
First is the "skeleton" of the system: it contains the menu and the options to change theme. That menu loads the contents of the second part which is composed essentially by an iframe which loads the modules called by the clicks on menu.
I can change the theme of the first part of the system using the following code:
$("link").attr("href", "css/temas/"+theme_name+".css");
The theme_name is gathered by reading the link on the menu click. The system is ok here, and no change is needed. Beyond changing the main theme, it records a cookie, which is used to read for further system theming.
So, the second part of the system also reads that cookie to apply the theme, but it doesn't change instantly as the main part does!
For example, when I click the theme icon, it instantly applies the theme without refreshing the screen, but that doesn't happens to the second part! It apply the theme, but it's shown only if I reload the iframe, and reloading, ain't cool!
I'm trying to change the iframe theme with the following code:
$("#ifr_main link").attr("href", theme_name);
Where #ifr_main is the iframe name!
Does anybody knows how can I figure that out and apply the new CSS without having to refresh the page, as I do on the menu?
You need to select the content of the iFrame first before trying to select it's link element.
$("#ifr_main").contents().find("link").attr("href", theme_name);
Side note, iFrames can be ugly :)
It is because iframe content was loaded when your page is loaded, so after it, you cannot change its looking unless you are using JQuery/ajax methods or reload.
Yo can find some questions about it
here, here and here
maybe you can reload your ifreame via ajax, read here
Finally you should watch this video for more unique way.
Bookmarklets allow you change the page you are currently viewing with javascript.
Is it possible to add the bookmarklet to a link so that it "changes" the next page where the link is pointing to?
If you want to create a universal bookmarklet working on any webpage then the answer is big fat NO! :)
But if you want to make it work on pages you control then everything is possible. One of possible solutions would be to add a cookie to the webpage using bookmarklet. The target page must be created the way it changes its behavior according to the value of cookie.