I'm a Software Engineer living and working in the North of Scotland. I'm currently co-founder & CTO of Lemon Squeezy.
Want to chat? Hit me up on Telegram or shoot me an email.
Dropit is a jQuery plugin for single level dropdown menu's
I'm a Software Engineer living and working in the North of Scotland. I'm currently co-founder & CTO of Lemon Squeezy.
Want to chat? Hit me up on Telegram or shoot me an email.
On iOS, when the sub menu is opened on tap, and then you tap outside to close, the sub menu isn't closing. Any ideas on how to fix this? There's no issue on click, just on tap.
I noticed that if the nav menu has 3 levels of list items, the 2nd level is not clickable. Is there a way to only activate DropIt for the first level of list items? The 3rd level of nav is not supposed to display at all and is only in place for use in the mobile menu. Thank for the great plugin and for any help!
$('.navigation .main > ul ').dropit();
`
`
The TLS (SSL) certificate for the domain dev7studios.com expired over a month ago. As such, no one can view the website without overriding a warning in their browser.
While not specifically an issue with this jquery plugin, it is an issue with the site the github page links to, and presumably the primary public-facing webpage for the plugin.
Hello!
I get error after i enter «bower i» command.
bower Dropit=dropit#^1.1.1 ECMDERR Failed to execute "git ls-remote --tags --heads git://github.com/gilbitron/Dropit=dropit.git", exit code of #128 fatal: remote error: gilbitron/Dropit=dropit is not a valid repository name Email [email protected] for help
fatal: remote error:
gilbitron/Dropit=dropit is not a valid repository name
Are there any way to solve it?
I can't make it work :( Index.htm with all files and source integrated would be really helpful. Sorry and please :)
Options afterShow
, afterHide
doesn't work at all.
This is my init code. Nothing has been changed in src code.
$('.dropdown').dropit({
beforeShow: function(){
$('.dropdown-submenu').addClass('animated animDrop')
},
afterShow: function(){
$('.dropdown-submenu').removeClass('animated animDrop')
},
beforeHide: function(){
$('.dropdown-submenu').addClass('animated zoomOut')
},
afterHide: function(){
$('.dropdown-submenu').removeClass('animated zoomOut')
},
});
If i comment out / delete afterHide & afterShow - it won't give me expected effect cause it only takes first applied class (animated animDrop
)
Is there a way to open the dropdown programmatically?
I tried doing $(".menu").click()
but that didnt work.
Any clue?
Hi There,
This menu is working great but two drop downs in our main nav contain a shopping cart and a search form.
The issue is that if a person clicks within the submenu, the menu disappears - i.e. if they click the search form or items in the cart, everything gets hidden.
Is there a way to hide the submenu ONLY if a trigger is clicked or if a click occurs outside the submenu?
I've tried targeting a class for the trigger element but like most jQuery plugins, there are no examples that show the correct syntax for adding the settings (I find javascript very confusing sorry).
I've tried:
<script>
$(document).ready(function() {
$('.dropit').dropit(
triggerEl: 'a.dropit-trigger-element', // The trigger element
);
});
</script>
and...
<script>
$(document).ready(function() {
$('.dropit').dropit(
{
triggerEl: 'a.dropit-trigger-element', // The trigger element
}
);
});
</script>
BTW, I'm using this pull request from 5months ago because this more recent pull request leaves a previous submenu open if a new one is triggered.
Sorry if this is easy - any pointers in the right direction would be much appreciated.
Cheers
Ben
When I click the menu trigger a second time (once it's expanded, in order to close it) it gets hidden.
I can't see why this is happening, could you perhaps see where I've gone wrong?
The markup is:
<ul id="l10n-menu">
<li>
<a href="#" class="current-locale en_GB">
v
</a>
<ul>
<li>
<a href="?locale=en_US" class="en">English (US)</a>
</li>
<li>
<a href="?locale=ur" class="ur" dir="rtl">Urdu</a>
</li>
</ul>
</li>
</ul>
And my init code is:
$(document).ready(function () {
$('#l10n-menu').dropit();
});
jq 2.2.0
<script src='js/dropit.js' type='text/javascript'></script>
<link href="css/dropit.css" rel="stylesheet" type="text/css">
$( document ).ready(function()
{
// Copy+Paste sample .menu
$( '.menu' ).dropit({
afterLoad: function(){ console.log("dropit initialized.") } // Triggers when plugin has loaded
});
}
Nothing was showing up on click, so I added the callback option afterLoad and I'm not getting this console msg.
When using jQuery v1.11.1 action: 'click' works fine, but using 'hover' does not work, (doesn't through any errors in the console).
Dropdown menus don't disappear when mousing out. Was this intentional? Is there an easy way to change this?
Hi.
I have a problem with dopit plugin. I create a submenu and put this in custom.js file:
$(document).ready(function() {
$('.nav-drop').dropit();
});
This is result:
I type a links to user can change language, but when I click nothings happened. Can you help me?
P.S. Link what I like to click is below. In ul class "list nav-drop-menu", li childrens a tag. sorry for bad marker.
We at VersionEye are working hard to keep up the quality of the bower's registry.
We just finished our initial analysis of the quality of the Bower.io registry:
7530 - registered packages, 224 of them doesnt exists anymore;
We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).
Sadly, your library gilbitron/Dropit
is one of them.
Can you spare 15 minutes to help us to make Bower better?
Just add a new file bower.json
and change attributes.
{
"name": "gilbitron/Dropit",
"version": "1.0.0",
"main": "path/to/main.css",
"description": "please add it",
"license": "Eclipse",
"ignore": [
".jshintrc",
"**/*.txt"
],
"dependencies": {
"<dependency_name>": "<semantic_version>",
"<dependency_name>": "<Local_folder>",
"<dependency_name>": "<package>"
},
"devDependencies": {
"<test-framework-name>": "<version>"
}
}
Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.
NB! Please validate your bower.json with jsonlint before commiting your updates.
Thank you!
Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!
How can I use Jquery to show which value in the submenu was clicked?
Thanks.
http://dev7studios.com/dropit in README no longer works.
Hi, I update jquery of 1.8 to 1.9 and Dropit stops to work.
Well, only post this to help.
Cheers.
dropit.js
is another project
Delete issue, wrong repo.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.