Bootstrap don't have effect in angular 10.2.1 - javascript

im trying to use some stuffs from bootstrap, but dont work at all, i realized that only buttons get effect , but the major things ins't work. for example i tried to add this dropdowlist bellow
but the result is that:
i add the cdn link direct in html page, and i already install boostrap via npm, but both cases the style boostrap and behavior isn't work properly.

try to add code below to your style.css
#import "~bootstrap/dist/css/bootstrap.min.css";
like the image below
enter image description here

Related

My animation is not working in this slider which I made using html, css, js

<https://codepen.io/samyakjain20/pen/dyMmaYj>
This is what I tried!, tried to integrate two slider designs mentioned below. The gesture animation which is there in the 1st link is not working in my slider.
https://codepen.io/codewunder/pen/Bnspb/
https://codepen.io/maheshambure21/pen/qZZrxy
I think the error is in JavaScript but I don't know how to solve. If you have seen something similar to this then also please mention it.
Just click in the cog icon on the JavaScript panel, and add the jQuery CDN link https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js
This error is because the jQuery library is not found in your code.

Navigation hover effect wordpress

So I've seen a hover effect which I want to apply to my WordPress navigation, but I can't make sense on how to add it or where to start as I don't have access to any of the HTML
The code for the effect
https://codepen.io/ohsoren/pen/QNoQwX
Please, could someone guide me on what I need to do to make this apply?
Maybe look for this
Anyway you have to edit your header.php, look here -> editor , add this html code, then you have to add also the .js file, also the example use postcss not css.
It's better with ftp access.

Jsfiddle with external libs, Font Awesome not rendering, isotope does not toggle layout

Jslint says everything is fine, and I am able to add the external libs. Also code works fine in the IDE/browser, not in Jsfiddle
using Jsfiddle I am trying to debug Isotope toggle size and layout in JS fiddle, but I am unable to get the external libs to render.
Can you help, and correct me?
- if the issue is the order of libs, or what options I selected, is it the semi-colon infront of the JS, I thought this is normally good/safe coding in JS..
Here is the code in JsFiddle, it works in the IDE not JsFiddle
I am using the following font awesome, bootstrap, isotope, ba-bounce, jquery 1.11.2 (JSfiddle only shows 1.11.0)
I'm not sure where you were trying to load your resources from, but you need to provide a URL to the css or js file you want to include. These are usually easy to find hosted on a cdn. I have reconstructed your fiddle using cdn links to the external resources:
jsfiddle: http://jsfiddle.net/voveson/popzfey4/5/

Why do bootstrap dropdowns only work when bootstrap-responsive.css is also included?

For a test case, I created a test project with the exact same code from Hero Demo and then removed the responsive CSS code.
Why is it that dropdowns do not work unless responsive is also included? I do not wish to use responsive in my project.
There must be something else wrong in your usage. Here's a very basic fiddle (markup copied directly from the linked demo) using just jquery.js, bootstrap-dropdown.js, bootstrap.css.
Make sure you've loaded the scripts before calling $('.dropdown-toggle').dropdown();, and that you're using the proper selector according to the way you've structured your dropdown!
As #crowjonah mentions in a comment above, dropdowns are not dependent on responsive.css. You should verify that you have jquery.js included in your page before bootstrap.js. I have a page that is not including bootstrap-responsive.css and the dropdowns work just fine. Also you should not need to include $('.dropdown-toggle').dropdown() if you are using the correct css tags as described in the demo. The only features that are opt-in are the tooltips and popovers.
Hope this helps, but if not please update your question with more code example of how you have bootstrap implemented.

supersized api.nextSlide();?

I am using the supersized plugin: http://buildinternet.com/project/supersized/docs.html#api_docs
But it is troubling me, the documentation is not very clear or not to me at least.
I am trying to load different images via my menu items, the doc says to insert the following but I do not understand where I should be adding this:
$(element).click(function(){
api.nextSlide();
});
I tried to put it anywhere with no luck, anyone?
I had to include any css files that came with supersized. And i missed them, that what the issue was.

Categories

Resources