How to load CSS using jquery


Tags: jquery,html,css,stylesheet

Problem :

I have loaded a css file on server so I am having a URL with me. How can i load it in my perl code using JQuery ?

So currently I am hardcoding the css in my mason page which is missing from the page something like this

JQ.onReady('show', function(){
    JQ.addStyles({styles: ["\n\n.ap_classic { border-top:1px solid #ccc;border-left:1px solid #ccc;border-bottom:1px solid #2F2F1D; border-right:1px solid   #2F2F1D;background-color:#EFEDD4;padding:3px; }  .ap_classic .ap_titlebar { color:#86875D;font-size:12px;padding:0 0 3px 0;line-height:1em; }  .ap_classic .ap_close { float:right; }  .ap_classic .ap_content { clear:both;background-color:white;border:1px solid #ACA976;padding:8px;font-size:11px; } "]});
});

I want to avoid hardcoding this css ?



Solution :

I don't get why you can not just insert the <link/> element in the <head/> section, but here's a jQuery snippet:

$('head').append( $('<link rel="stylesheet" type="text/css" />').attr('href', 'your stylesheet url') );

    CSS Howto..

    JavaFX - Where is the css file for definition of StageStyle located or how can I change it?

    How to make input placeholder text not opaque when the text field background is opaque

    How to align social media icons in one row?

    How to Style Similar to an Exam Questi-n

    CSS - How to Style a Selected Radio Buttons Label?

    Can someone help me figure out how to put normal links into this Jquery Menu?

    How to make this loading animation?

    How do I make a nested
    expand to its contents?

    How to change the css style for phone and desktop?

    How to delete only the selected message inside a #Chat using jquery?

    Jquery how to get specific css values from css properties with stacked value options such as font-family

    How to align text vertically equal top CSS

    How to put text in the center of box while using border-box in CSS?

    How to put a menu over the full width of the page using HTML and CSS?

    How to apply CSS to the first letter after :before content?

    How to use only CSS to round my div tag area's corners?

    How to make a button CSS change only IF form fields are valid

    CSS how to make icons look like they are inside the backround

    How can I put solid lines on either side of a header with css? [duplicate]

    CSS How to generate this Shape on a Div or on Canvas

    How to change different language to different font-size at same line without unique each container?

    how to affect an element's width by one child element but not others using CSS

    How would I do a two finger drag with javascript/jquery?

    How to always center a flexible square in viewport with pure CSS?

    How to hover over a div to change just a part of its background?

    I have a standard table with text inside. How do I vertical align this?

    What CSS properties govern how a webpage reacts to window resizing?

    How to control the CSS of the contents that loaded dynamically into iframe?

    How to add a tooltip for just the background image of an input field with HTML and CSS

    how to style xml tag attribute with css