html5 article jquery mixitup not working - javascript

I've a problem with my portfolio and the mixitup to filter the article in the section. I don't know if the problem is that the grid div is not a top level element or that i use section and articles instead of a ul - li list. I've done the GettingStarted http://mixitup.io/#Documentation on there Website several times but I don't find the issue with my code. Have a look at my code here. I found a working example here! Cheers

The problem of your jsfiddle example is, that there is no jQuery defined.
In the top left corner of site please choose jquery version in this block: "Frameworks & Extensions". 1.11.0 version is nice with it.
But if you meaned that your sorting doesn't work fine, so please synchronise your "data-filters" with classes in blocks.
For example:
Lalala
This will be shown when Lalala pressed.
Data-filter = selector of the class you should put near "mix" class.
Best regards, Hope you'll make it work! :)

Related

Bootstrap tooltip incorrect positioning

I've just recently started using bootstrap and am working on part of my Christmas present to my girlfriend - a puzzle for her to figure out what her real present is (tickets to Hamilton in London).
However, I've run into an issue with the bootstrap tooltips. I'm expecting to see a tooltip next to the span word that is clicked, on hover or click. But for some reason the tool tip is up in the top-left of the body.
Could anyone help me out here?
Here is a pen that shows the error:
Link to CodePen
I'm using the suggested example of initializing with:
$("[data-toggle='tooltip']").tooltip();
Try using the same version of Bootstrap. Either go for v3 or v4 completely. The problem should be resolved once you use compatible files.

Hide Element on onepage-scroll.js site

right now I'm building a site using Pete R.'s 'onepage-scroll.js' plugin you can find
HERE.
I'm also using Bootstrap and what I want to do is hiding bootraps horizontal nav-bar when on the first 'site' and show it on all the other 'sites' (by sites I mean the different sections this plugin uses). My first idea was to create something like a .hideit css-class and tell jQuery to overwrite it whenever the visible section is not the first, but after trying it for hours I can't find the solution - hope you can help me!

Specific accordeon-menu behavior, possibly jquery ui or bootstrap

I am trying to create an accordeon-navigation with a specific behavior: The first of the collapsible contents does not have a toggle-link but instead will be shown on start of the site AND when the following (so the second) collapsible content is closed.
I tried before to achieve this with both bootstraps collapse-feature and the jqueryi-ui-accordeon, but never really got it to work the way I described. So I built it manually just with jquery, but now I can't really get the "slide and push" effect, which basically is the "heart" of accordeon elements I think to work.
You can see it basically running in this fiddle with a not-so-beautiful fade effect:
http://jsfiddle.net/8fL6L/31/
Sry, I have to add fake code here, otherwise I can't post the fiddle-link...
When I use jquery-ui's slide-effect instead of fading, the content to slide up just slides out but does not push/pull the content above/below it with it.
So, does anyone have an idea how to achieve this - either with the bootstrap or jquery-ui accordeon or by modifying my code?
Much thanks for thinking about it in advance! :-)
Sorry folks, came up with my own solution, posting it here now in case it helps anyone in the future.
I slightly modified bootstrap's collapse()-functionality so that on closing one collapsible, the previous collapsible is automatically opened (if it exists). That's the only "new" thing, the opening of one collapsible by default was already easily possible without modifying anything in bootstrap.
http://jsfiddle.net/8fL6L/51/
Just give the wrapping container of the collapsibles the id
#collapsibles
, call
initCollapsibles()
on $(document).ready() and you're good to go.
Hope, this might some day help someone. :-)

Javascript plugin

i was wondering if anybody knows (and if there is such a thing) a javascript plugin that can do to following:
on the website http://www.worldofmerix.com/ click on any of the menu buttons on top for eg. "about us"; then you see a line appear in the middle and expand so that you can see the entire div...
I need a similar animation effect, flash is out of the question, so i have to use javascript...
i have some ideas on making it with some "smooth div fade in/out" js plugins, but i was wondering if there is a plugin SPECIFIC to the thing i need?
thanks very much in advance for the anwsers!
Ok, since you didn't state any jQuery "dont-wanting" I'd recommend you to check out jQuery. It is a set of JavaScript libraries that help you manage your HTML and CSS with some light code.
You can see HERE, HERE and HERE how it can animate divs and other elements (I see that it is what you need).
You can check out the official web site and there you can find all kinds of examples and documentation that you will ever need. I recommend you to see THIS (click RUN).

How to create an endless picture-show without marquee?

I wrote a module for Joomla! 1.5 which shows the pictures (banners) with the most clicks. Now I want to show this list scrolling on the home-site. With "marquee" there is a break after the last picture.
I've found an advice which said I'll have to create a div-container with overflow: hidden and a second div with javascripte which changes the positions of the pictures.
Can anyone help me to write this code, because I don't get javascripte?
There are plenty of free ones you can get that are already written for you.
Try one of these jquery scripts to do what you are looking for...
http://plugins.jquery.com/project/Plugins/category/48
The best way to implement such feature is looking to this great JQuery Video tutorial and you will have a great product :)
URL: JQuery Spy effect
MOV: Jquery Spy effect
Hope that is exactly what you are looking for.

Categories

Resources