How can I use multiple or selectors in fancybox 3? - fancybox-3

Can someone help me in adding multiple selectors if possible in
$().fancybox({
selector : '.imglist a:visible'
});
eg
$().fancybox({
selector : '.imglist a:visible, .owl-item'
});
regards,

Your last snippet works perfectly fine, it is a valid selector - https://api.jquery.com/multiple-selector/
If you have any issue, then, please, create a live demo so it would be possible to investigate your problem and to give a helpful answer.

Related

How does the CSS Pseudo-Class :state() work?

On MDN I read about the :state() pseudo-class, however the page doesn't help much. I've tried to find some information somewhere else but wasn't very lucky. Can someone explain to me, how this pseudo-class is used?
I'm not looking for explanations on how to use pseudo-classes in general. I understand how to use :hover or :nth-child() for example but I don't understand how you can use :state(); like what to use as an argument. Maybe someone can give a quick example.

Conditional Comment ie7 not working

So I put the ie7 conditional comment in my head tag directly underneath the comment to pull up the original style.css file:
Then I made a css file called ie7.css made a few changes in the css...
Checked IE7 to look at the site http://www.sgconstruction.org and no changes were visible...
I have no idea why it's not making any changes. Any help would be greatly appreciated. Thank you!
You have multiple calls to stylesheet links. After your IE7 conditional, the main style sheet (themes/SG/style.css) is called again, making your conditional stylesheet pointless (at it's current location).
For people who come late, I think this is a better, more up to date way to go about targeting specific versions of IE: http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

Multiple CSS Classes on a Single Element issue

I'm using a combination of two classes on a span element.
Both look like they're working by themselves... Together they're not.
.black {color:black;}
.size_14 {font-size:14px;}
<span class="black size_14">my text is not black..neither large</span>
I tried changing the size_14 class name for another one (large) and in this case it is working.
Is size_14 an invalid class name?
SOLVED
I was overriding the behaviour with
.article_text_div .size_14 {color:#6D6E71;}
But thanks to this mistake I discovered It's better(?) not to use underscores inside class names
Double thanks
Luca
That example seems to work fine. There must be another rule that is overriding your change. Check the CSS with Firebug or a similar inspector, it will tell you exactly which classes are being used and overridden.
Underscores are not recommended in class names and ID's. Support is mixed across the board. I would remove it or replace it with a dash.
If I were you I'd be inclined to try the following, but without seeing the rest of the code it's difficult to tell if it'll make a difference..
.black{color:black;}
.size-14, span.size-14{font-size:14px;}
You can use underscore, article in above comment was written in 2001. All latest browser supports use of _. But most developer prefer to use "-" for class names.
http://jsfiddle.net/ZsR4A/embedded/result/
Works as expected in IE, FF, Chrome. Make sure your size_14 has higher specificity.

How to find number of style classes defined in a CSS file

How do you find number of style classes defined in a CSS file? I need to clean my stylesheet. Please tell me of any good clean-up solutions.
I just tried to get count of '{', worked
Try Dust-me, a Firefox add-one. It shows you all unused CSS selectors. https://addons.mozilla.org/en-us/firefox/addon/dust-me-selectors/

How to figure out which lines of css is not actually affecting anything again?

I changed the html multiple times,but without deleting the related css specification.
And now there are quite some useless css there.
Is there an efficient solution to grep all them?
There's an excellent plugin for FireFox called DustMe that you can try.
If I recall correctly DreamWeaver has that functionality.
Google search turned up some tools:
Dust Me
Detecting Unused CSS Selectors
Get firebug, and then you can see what's redundant and try getting rid of css rules and see if it makes a difference!

Resources