How can I autoload the #menu of the first two jsplayers so that it opens onload of the page?
Tecnically I need to auto load this
<div class="sm2-button-bd">
menu
</div>
Thanks
You can use like this:
window.location.hash = 'menu';
Try
window.onload=function() {
document.querySelector(".sm2-inline-button menu").click();
}
jQuery:
$(function() {
$(".sm2-inline-button menu").first().click();
});
Related
There are multiple links generated at run time with no specific ids tied to them, here is the code which generate links in the loop
<%for(int p=0;p<displayLink.length;p++){%>
<a href="javascript:removeAccount('<%=displayLink[p]%>')" ><%=displayLink[p]%></a>
<br>
<% }
Upon clicking on the link, it should be hidden or removed from the page, I am trying below but its not working.
function removeAccount (link){
$("#link").on('click', function(e) {
$('#link').prop('disabled',true);
});
}
function removeAccount (link){
$("#link").on('click', function(e) {
e.preventDefault();
$('#link').hide();
});
}
Try this code
<%for(int p=0;p<displayLink.length;p++){%>
<a href="javascript:void(0)" class="my-link" ><%=displayAcct[p]%></a><br>
<% } %>
Javascript
$(".my-link").on('click', function() {
$(this).hide();
});
this might give you some ideas:
edit: But it is unclear what do you expect to happen other than hiding it.
$("#links a").click(function(e) {
e.preventDefault();
$(this).fadeOut();
$('#out').html($(this).data('link'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="links">
link1
link2
link3
link4
link5
</div>
<span id="out"></span>
You cannot disable a link, it can be show/hide. In your, this is what you are looking for:
$('#link').hide();
If you want to completely remove the link from the page:
$('#link').remove();
I'm working on this theme and I wanted to create this simple nav that would fadeIn on click and fadeOut on click.
<div id="mobile-nav">
<a class="exit"></a>
<div class="logo"></div>
<div class="center">
<li class="skincare">Skincare</li>
<li class="makeup">Makeup</li>
<li class="kits">Kits</li>
<li class="help">Help</li>
</div>
</div>
<script>
$(function() {
$('.exit').click(function(){
$('#mobile-nav').fadeOut();
});
}
</script>
However it doesn't seem to work when I try it out. Other types of script like swiper.js works, but this simple script doesn't work. Is there anything wrong with what I'm doing? I've been checking for errors and jQuery is loading as well.
Live preview here - http://magazine.eldecosmetics.com/
It should be
$(function() {
$$('.exit').invoke('observe', 'click', function() {
$('#mobile-nav').toggleClass('fadedOut');
});
});
Your code is
$(function() {
$$('.exit').invoke('observe', 'click', function() {
$('#mobile-nav').toggleClassName('fadedOut');
});
}
In Magento try to avoid jquery conflicts you must use jQuery instead of $ symbol.
For example i have mentioned the correct coding
jQuery(function(){
$$('.exit').invoke('observe', 'click', function() {
jQuery('#mobile-nav').toggleClass('fadedOut');
});
});
Hope it will helps to you guys.
I have two div and I want to open these two div in new tab by using one click.
<div id="google">This is Google.</div>
<div id="youtube">This is YouTube.</div>
Something like this should do that
$('a').on('click', function(e) {
e.preventDefault();
$('a').each(function() {
window.open(this.href, '_blank');
});
});
Here's a demonstration using a button
Add 'target=_blank' to in <a> tag .
This is Google.</div>
This is YouTube.</div>
Use javascript for both
<script>
$('#googel,#youtube').click(function()
{
// your commands...
})
</script>
Without javascript, it's not possible to open two links in two different tabs on one click. So my suggestion is to wrap those divs in a parent div and do some javascript.
var wrapper = document.getElementById('wrapper');
wrapper.onclick = function(){
window.open('http://google.com', '_blank');
window.open('http://youtube.com', '_blank');
};
#wrapper{
cursor: pointer;
}
#wrapper:hover{
background-color: #0ff;
}
<div id="wrapper">
<div id="google">This is Google.</div>
<div id="youtube">This is YouTube.</div>
</div>
As you can try this:
$("#google, #youtube").click("Do your work");
For more:
Reference-1 & Reference-2
I have just trying to come up with a button to hide content based on a example I've seen that works.
HTML
<button id="button">Test</button><br/><br/>
<div id="panel">Test Panel</div>
jQuery
$(document).ready(function(){
$("#button").toggle(function() {
if $("#panel").css("display") == "none" {
$("#panel").html("Show");
} else {
$("#panel").html("Hide");
};
});
});
CSS
#panel {display:none;}
Any help is appreciated. Thank you!
Toggle is deprecated.. Just attach a click event to the button and use the toggle method for the panel
$("#button").click(function() {
$("#panel").toggle();
});
Check Fiddle
How to close element opened by toggle() function when I click on any place in browser window. For example StackExchange link on this site. When I click on this link div appears, but if I click on any place in window, it disappears.
You can do in this way:
$(function(){
$('.yourelem, .targetDiv').click(function(ev){
$('.targetDiv').slideDown('fast');
ev.stopPropagation();
});
$(document).click(function(){
$('.targetDiv').slideUp('fast');
});
});
See the action in jsbin
Try this :
HTML
<a id="show" href="#">show</a>
<div class="test" style="display: none;">
hey
</div>
JS
$('a#show').click(function(event) {
event.stopPropagation();
$('.test').toggle();
});
$('html').click(function() {
$('.test').hide();
});
Take a look on .blur function of jquery http://api.jquery.com/blur/
A quick example:
$("#myelement").blur(function(){
$(this).hide();
//or
$("#targetelement").hide();
});
Make variable sel true, if we click on the div.
if(sel)
$(".stackExchange").slideDown(800);
else
$(".stackExchange").slideUp(800);