var next_text=item.text().sub str(item.text().index Of("")+0,item.text().index Of("")+9);})
I wanted apply css property display none on the value next_text.How can i achieve that?
There must be Jquery object, On variable you can not apply css. Refer: http://www.w3schools.com/jquery/jquery_css.asp
Related
I am looking for the next scenario in css where i will be able to check if a style is applied without using any javascript code. Example: If flex: wrap is applied add another style like gap: 5. All this computations should be done using only css. I inspected the documentation but i did not find something similar. Could somebody help?
You can directly use the "gap" css. If there is a flex property used, only then the gap property will work. So no harm in using the gap property by default. Why check for whether flex is used or not.
as far as I understand, to check a style is applied, it must use javascript code,
ex:
const box = document.getElementById('box');
// Check if CSS property is contained in Style
if (box.style.backgroundColor) {
console.log('value is', box.style.backgroundColor);
} else {
console.log('CSS property is not contained in style');
}
I am trying to change value of CSS variable based on another variable. I want to check if current value of variable is white then set it to black...
In some class suppose my variable is --default-var, value of --default-var can be any color....
If value of default-var is white then change it to black
i tried
.my-class{
#if var(--default-var) == #fff{
--default-var : #000;
}
}
I have also tried
.my-class{
#if --default-var == #fff{
--default-var : #000;
}
}
both cases are not working..please help.
Best practice here is to create two classes with the different CSS values and then toggle the class using logic such as in C# Razor or Javascript. This keeps it cleaner to read.
You can not use this kind of Logic in CSS. There are workarounds though.
Use a Preprocessor
You could use either SASS or Less to create CSS-Files that are created conditionally based on variables that you can set yourself. This however only helps if you´re decision is made on build-time. So this will not help you if you want to react to user input.
This is not entirely true, as there are some pseudo selectors that in the end can change styles based on user input. However, you can not use them to react to variables set in your CSS.
Use Javascript
With Javascript you can manipulate elements and their style-Property or their class-List directly. In order to control under what condition you want these changes to be made you can use all the tools that you have in Javascript.
You could read what value your css variable has and then change styles on other classes based on that value.
Just Google for js DOM manipulation or setting css with js. In order to provide better ressources i´d need some more information on what exactly you want to do. This may be what you are looking for: https://stackoverflow.com/a/51860936/11930769.
In stylus is it possible to change a variable based on the class of the parent?
I'm trying to create a variable which will change the colours from white to black depending on it being inside something with an '.inverted' class. I only want the variable to change though (so I can use it for any colour-based property).
If it were written in jQuery it would look like this:
$lightswitch = ($(this).parents('.inverse')) ? '#000' : '#fff';
I imagine there is a mixin or something I could write for this but I can't quite get my head around how to do it.
Ugh. I don't think that can be done with CSS or stylus. You'll have to use a jQuery solution for that.
Gotta wait for css4's "parent selector!" $E > F
Stay awesome!
I am working with Magento which doesn't allow for classes on images in the visual editor; so I want to program it to automatically apply right margin to an image if the image has the property float:left ... and visa versa. Is this possible without using javascript?
If it's part of the style attribute, then sure: [style*='float:left']
No, there isn't a selector based on CSS properties, apart from scanning selecting on the style attribute - after all you set them with CSS.
The easiest way would be to set the margin-right property at the same place where you set the float property.
See also:
http://www.w3.org/TR/selectors/#selectors
http://dev.w3.org/csswg/selectors4/#overview
Assuming all of your styles are placed in an external stylesheet the answer's 'not without javascript'.
If, however, you're placing that specific style on the html (inline styles, that is) then what Kolink suggested does work.
Anyway, using javascript(jQuery) here's a possible solution: http://jsfiddle.net/joplomacedo/TECWM/
If you can't see the fiddle, it goes something like this:
if (el.css('float') === 'left') {
el.css({
'margin-left': '50px'
});
}
I am setting styles like so:
button2.Style.Add("color", "#eee");
How do I now check what the color value of that control is?
if (button2.Style["color"] == "#eee") doesn't work.
Have a look at jquery which has a .css method that can both set and query css values.
Have look at this page