I have already tried to find an answer for this but can't seem to find it... i want to do something like this
http://es.wix.com/website-template/view/html/748?originUrl=http%3A%2F%2Fes.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fall%2F4&bookName=create-master-b-test&galleryDocIndex=4
So, far I got the menu which is working with css3, html and java..... but I can't put this one
http://www.queness.com/resources/html/scroll/horizontal.html
with the menu working together... they won't do ...
This is my website http://www.softglobal.com.mx you can see the menu there... I want to understand how the sliding panels work. so I can do it myself. what am I doing wrong?? I really want to learn and understand how it work in the example and do it myself. Thank you.
Related
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. :-)
Quite frankly I don't even know how to describe what I'm attempting to do. "Dynamic Navbar" is the best I have come up with.
Basically, I've created a single page website with 4 "pages" (sections) using purely HTML and CSS (as well as jQuery for smoothScroll).
I want the highlighted link on the navbar (the current page) to change when users scroll between pages. I've seen this done before, such as on this site:
http://thinkpixellab.com/
I have little-to-no experience with JavaScript and jQuery and I'm really not sure where to start. If anyone could point me in the right direction I would greatly appreicate it!
What you're looking for is ScrollSpy. It's made for Mootools originally, I think: Scrollspy
Bootstrap have it as a plugin for their framework: Bootstrap Scrollspy
I found a standalone JQuery plugin for it, though not sure how good it is as I haven't used it myself: plugin
Obviously you could write something yourself, but with not much experience of JS/Jquery I reckon you're better off sticking to a plugin or something.
A friend asked me if I could help her out with a project she's working on. She wants to bring over a message and wants to do this with a website where the users can just scroll and read stuff.
Here you can check out a PDF that show what she is trying to accomplish:
https://www.dropbox.com/s/bew7rw1uzjv8nwc/INFOpagina.pdf
When you start scrolling around slide 4 and 5 you should get the idea, words and images change from position when you scroll.
So my question now is, do you guys know any Javascript or Jquery plugins that could help me achieving this? I already searched a lot on google but can't really find any stuff that's really appropriate.
Thanks, would really appreciate the help.
jQuery Scroll Path Plugin is the perfect JQuery plugin for you.
So, recently I have been trying to build a user interface form builder that is almost entirely drag and drop. Kind of like Dreamweaver or visual studios I suppose. You guys can see it for yourselves HERE! I am trying to get a right-click menu thing going, however upon getting this working, I realized that it really conflicted with both the draggable and resizable methods. I don't have to right click at all, however when I go to resize or drag, it won't let me stop it. My cursor gets stuck either resizing or dragging, and requires vigorous clicking and shaking to free it. So, I'm assuming that I need a different plugin. Does anybody know of a stress free simple right-click menu that is hopefully compatible with jquery ui? I've tried google but most of them are simply a different version of the one I've already been using.
My second question is much more vague. As I previously mentioned, I'm trying to make a form builder. I'm wondering what the best way to go about this is as I feel sort of lost. My biggest problems right now are figuring out how I'm going to parse everything into code and export it. Does anybody know of anyone else who has attempted this or something similar? Is there any sort of guide?
I know the second questions has potential to be rather annoying, so feel free to only focus on the first one. Any help is appreciated, and I thank everybody who helps me.
EDIT: Just realized that you guys may not know how to use the builder. So far, all you can do is drag panels out onto the building space, and then drag tables within the panels. You can resize the building space, and panels vertically, and you can resize tables both vertically and horizontally. You can move panels and tables within their parent elements. Right click a panel or table for the contextmenu.
EDIT: So I think I found a context menu that will suffice, here it is. So, I guess that only leaves giving me advice on how to go about constructing this form builder.
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).