Replace a CSS sheet [closed] - javascript

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed last year.
This post was edited and submitted for review last year and failed to reopen the post:
Original close reason(s) were not resolved
Improve this question
I am using an script which uses a remote file.css. I want to add a local file.css in order to override some remote.css styles.
Any suggestion of how could I do it?
Thank you!

If you just want to use the new styles instead, you can find the link element and just replace the href with the path to the other file. Like this:
document.querySelector("link[href=style.css]").href = "path/to/new/file.css";
If you want to override some styles, you'll need to make sure the new file is loaded after the first and then either use more specific selecors or !important. You can't really "edit" the file in the browser before loading it though, which is what it sounds like you might be asking about.

If you want to edit the css and not to replace all the css, you can use inline style or you can use bootstrap.
For example:
…

Related

Using javascript is it possible to add some CSS based on if the user comes from a specific web address maybe using Referrer? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
We have a landing page on our sub-domain (i.e. landing.ourcompany.com) that we forward people to our Wordpress website page (ourcompany.com/page) but have one content item (with a CSS class) we want to "display: none;" if they come from that specific link (i.e. landing.ourcompany.com). Is it possible with javascript to detect the Referrer link and then add the CSS to the page?
Yes, you can, as you said, in your page you can do something like
if(document.referrer == "google.com"){
document.body.classList.add("googleRef") //or whatever you want
}
then, since the class in on the body, your stylesheet can have something like
.googleRef .divThatIWantToHide{
display: none
}
So the class on the body tag element works as a flag to know what to hide. Take in consideration that the if statement needs to be improved

How to make a input space in vanilla html css and javascript [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
I want to create an input space like the compose question input space of stackoverflow.
I have a blog. In the admin section of my blog I have a compose section. Now it only supports text and 1 paragraph. I want it to have the options to bold the text and make it italics or include some images by the user and also the support of multiple paras.
You can see a very good example of what I am trying to say in the stackoverflow's ask question section. The code should be in vanilla html, css and, js not react or any other framework.
I was not able to find anything over internet related to it.
Any help will be appreciated.
you can use a contenteditable element, see more at https://www.w3schools.com/tags/att_global_contenteditable.asp
You can use ctrl+b, ctrl+u, ctrl+i, etc. to make it bold, underlined, and italicised. You can also use document.execCommand() (https://www.w3schools.com/jsref/met_document_execcommand.asp) to create buttons that do this. document.execCommand() can change any CSS, so you can change size, color, bold, etc.

How to use grid in HTML [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I have a assignment.
I want to create a grid with list of friends with their name and photo add search bar on top of it whenever you type their name, it should filter and show only that by default it should show all.
This can be easy achieved using JQuery and a 3rd party javascript library called "Datatables".
Basically you only need to create an HTML table with all the names and photos, then add JQuery and Datatbles libraries to your HTML and initialize it.
On this link:
https://www.datatables.net/examples/basic_init/zero_configuration.html
you will find the most basic code example to configure datatables.
As comment, this solution will indeed give you the results you look for, but if this is a homework maybe your professor is expecting to you to code this functionality from scratch and not using 3rd party libraries.
Regards.

Invert everything on page except imges [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Hi I'm trying to invert everything on the page except for images? Any help will be appreciated. Thanks.
http://jsfiddle.net/nikita_turing/jVKw6/3/
Bookmarklet
If you can use jQuery, use the pseudo selector :not(img) to select all the elements except images, then set the CSS you want.
Something like
$(":not(img)").css({"-webkit-filter": "invert(100%)","-moz-filter": "invert(100%)","-o-filter": "invert(100%)","-ms-filter": "invert(100%)"});
There are can be two different solutions. Maybe not the best.
The first, Find all images
Then invert elements and invert images back to the first condition.
The second, using jQuery get all img elements and do the same work as in the previous idea.

Adding a Maxlength attribute to HTML using jQuery [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I'm having an issue at work with a rather picky client.
We use a rather strange script to deal with something that they require. We're an online assessment company and this script in general applies in our test player, rather than in our question editor, so we can't make change in the html, as you normally would with a text input box.
I know the maxlength attribute can be added through use of jQuery by using something along the lines of
$("input").prop("maxLength", 3)
However, I do not know how I would reference this in the HTML, as it would only be used in a couple of questions that use this script so making it standard for these questions by adding it to the JavaScript used is not an option.
The inputs that you need to apply this to would need to have ID's or Classes.
As you cannot edit the HTML this would only work, if those input's had ID's or Classes already.
If you want to apply it to an element with an Id you would do:
$("#IDGOESHERE").prop("maxLength", 3);
http://api.jquery.com/id-selector/
If it was with a class :
$(".CLASSNAMEHERE").prop("maxLength", 3);
http://api.jquery.com/class-selector/
You could get a little more fancy, by using EQ,
$("input").eq(5).prop("maxLength", 3);
Which would apply the max length to the 5th input on the page.
http://api.jquery.com/eq/

Categories