Hide Element on onepage-scroll.js site - javascript

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!

Related

Slider in Wordpress

I want to make a slider in my custom wordpress theme (using understrap):
I tried using flexslider, had a problem where i could not target the .slides ul for whatever reason. i edited it in my _theme.scss and also tried in the flexslider.css
Why did it work in the inspector, but not in the css / scss files?
This was the first hurdle. The second is, i dont want to have dots below to see what picture i am viewing, i want to have lines , in the right-middle of the picture which shows on an active state the number of the picture currently viewing, for example picture 1 is viewed, show "1" next to the active line.
as this has become impossible to solve with my current skills i am asking you guys to help me out please.
i would use the bootstrap carousel, too. But i am unsure how to edit the above mentioned css to create the desired outcome.
I do not want to use a wordpress plugin as this limits me probably in my decisions. I cannot do "if active state "1" then write "1" next to the picture" or something like that, if you know what i mean.
sorry for putting it really general but thats all i can provide as i have only the non - working flexslider locally installed.
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.

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. :-)

Radiobutton Tree Control

I am developing a search form which displays a number of categories and sub-categories. The client has requested that I do not use cascading dropdowns but to display radiobuttons instead so that the user can see the top level categories at a glance.
I had a bit of a look around for any javascript plugins that might give me a head start and save me from having to write all of the code from scratch but didnt come up with too much.
Can anyone suggest a good plugin that will allow me to display a radio button list in a hierarchical collapsible tree structure?
Cheers,
Tristan
Solution
I ended up using this plugin and adapting it to my own needs -> http://code.google.com/p/checkboxtree/
There is a great jQuery plugin called jsTree.
http://www.jstree.com/
I personalize it for my needs as well.

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