How to get a css stylesheet value that is not interpreted by the browswer?

Tags: javascript,html,css

Problem :

I would like to get a value of the css stylesheet that is not actually used by the browser during rendering.

For instance:

.blur {    
  data : "Great";

Let us say I use this class on a div as such:

<div class = "blur"></div>

What I tried and does NOT work.


Expected Output


EDIT: Sorry, I didn't mention this before, seems to be causing some confusion now. But please read this!

As I stated in the comment below and would like to emphasize, I have made the algorithm for generating a some text shadow on Internet Explorer---not the best algorithm, but still does the trick. However, I am trying to access the text-shadow attribute of a certain element but I can't since Internet Explorer doesn't store it since it doesn't really render it in the first place so I need to access the stylesheet data. So the question which I asked is again accessing "data" which too isn't stored just like textShadow for IE8, IE9.

Solution :

You can have raw access to style sheet tags, that's the best you can do, you can then parse the text for the information you're looking for with something like

// You'd have to find the right style tag
// outputs  a string like:   .blur {      color: red;  data : "Great";}  

This looks like a big hack, but I can't yet think of a way to do what you need in a more elegant way. , a better approach would be to use something like IE's filters instead Text Shadow in Internet Explorer? I think your approach of trying to fix this problem on your own is going to take way more effort than it's worth and you'll be going against the flow, creating friction with other code.

.myclass {    
  text-shadow: 2px 2px gray;
  filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='gray')


    CSS Howto..

    How to remove hover function from top row in table

    CSS triangle over a div using :before and :after - weird offset, how to fix?

    How to create inheritance with LESS?

    How do I get rid of the big margin between my labels and the input fields?

    How to make a div to fit all available width even hidden with scroll?

    CSS - want to remove a blank space but have no idea how to get rid of it?

    how to set width,height etc to particular table in html

    How to add Print headers and footers in HTML, CSS and JavaScript?

    Sublime - CSS - how to auto add .class for each section in the whole code?

    How to use jQuery to read/write the values of an elements externally defined css class?

    How to target element which have spaces in it's class name css?

    How to remove “padding” from ionic card

    How can I place the text in this box like this with CSS?

    How do I force nested list items to be the same width as parent list item?

    How to add CSS for dynamic MenuItems in MenuList and How to get the value of the MenuItem in XUL

    css3 : how to make div go up to bottom of page?

    How can I remove comments on-fly from my static CSS files?

    How to link an external stylesheet in CSS

    How to create this type of window,as described in the attached picture with HTML,CSS? [closed]

    multiple “HTML” tags in HTML file: how to separate CSS rules when classes and id's can be the same?

    How to set the width of a list, in css

    How do I obtain a floating element's left offset while it is outside the viewport?

    How to fix the top row and first column in a webpage, with only CSS

    text-rendering in css, what is it? and how to use it?

    How to modify output buffer?

    How to get different class selectors using nth-child in css

    How to emulate iOS style dropdown menus with html, css, javascript/jquery?

    How to add vertical and horizontal separators between inline elements in CSS?

    How to make a child div to grow to full screen using CSS?

    How would I get my horizontal navigation bar to span the full width?