We Keep Coding

apply css when element before and after button wrapper using JS

I have a code but i don't know why it does not working, even if it's a simple code of
if condition.
$(".btn-superimposed-wrapper").each(function () {
if (($(this).prev(".wp-block-group")) && ($(this).next(".wp-block-group"))) {
$(this).css({ "margin-top": "-8rem", "margin-bottom": "-6rem", "text-align": "center" });
}
});
i also tried with hasClass() :
$(".btn-superimposed-wrapper").each(function () {
if ($(this).prev().hasClass(".wp-block-group") && $(this).next().hasClass(".wp-block-group")) {
$(this).css({ "margin-top": "-8rem", "margin-bottom": "-6rem", "text-align": "center" });
console.log("PREV ;",$(this).prev())
console.log("NEXT ;",$(this).next())
}
});
i need to add the css style (above) to button when it have a div with class .wp-block-group before AND after.
But for example if i change the name of the div.wp-block-group in the html, it style apply the css as the condition is always true knowing that we have a condition with AND, i don't understand !

Consider the following.
$(".btn-superimposed-wrapper").each(function (i, el) {
if ($(el).prev().hasClass("wp-block-group") && $(el).next().hasClass("wp-block-group")) {
$(el).css({
"margin-top": "-8rem",
"margin-bottom": "-6rem",
"text-align": "center"
});
}
});
This will examine the previous and next elements and if they both have the Class, will return true.

.click() jquery function not working. Any ideas?

https://jsfiddle.net/gmz73oew/
So I'm trying to make it so that on the click of the button the height of the div grows. I've got this animation working by itself smoothly but I'm having issues when I try to make it happen via clicking the button.
$(document).ready(function() {
$("#button1").click(function(){
$("#maBlock").animate({
height: "950px",
top: "0px",
}, 2000 );
});
}
Help is appreciated.

You need to add a bracket and a semicolon to the end, to close the ones that $(document).ready(function() { opened:
$(document).ready(function () {
$("#button1").click(function () {
$("#maBlock").animate({
height: "950px",
top: "0px",
}, 2000);
});
}); //here you need the ');'

There is a syntax error in your code
replace your js code below snippet of code
click here
$(document).ready(function() {
$("#button").click(function(){
$("#maBlock").animate({
height: "950px",
top: "0px",
}, 2000 );
});
});

You forgot bracket and semicolon in the last row
$(document).ready(function() {
alert('ciao');
$("#button1").click(function(){
$("#maBlock").animate({
height: "950px",
top: "0px",
}, 2000 );
});
});//<----- this

Make div animate up and down with jQuery

Im trying to get a div move up and down from its current position during a mouse hover event - I have the followng but it only works once and then stops as opposed to continually cycling?
tiptitle.stop(true, true).animate({
'top': '5px'
}, 100).stop(true, true).animate({
'top': '0px'
}, 100);

make an infinite loop
function animate(isOpen) {
tiptitle.stop().animate({'top': isOpen ? '5px' : '0px'}, 100, function() { animate(!isOpen); })
}

Jquery animation looping

I am trying to make this animation loop
$(".jquery_bounce").ready(function(){
$("img", this).animate({ marginLeft : '20px' } , {
duration: 200,
complete:function() {
$(this).animate({ marginLeft : '0px' } , {
duration: 200,
easing: 'easeInCubic',
});
}
});
})
});
<div class="example">
<h4>Bounce</h4>
<div class="jquery_bounce bounce">
<img src="images/bounceimg.png" class="bounceimg" />
</div>
</div>
Please help.

try this~
$(function(){
$.extend({
show:function(){
$(".jquery_bounce").ready(function(){
$("img", this).animate({ marginLeft : '20px' } , {
duration: 200,
complete:function() {
$(this).animate({ marginLeft : '0px' } , {
specialEasing: {
left: 'swing',
top: 'easeOutBounce'
}
});
}
});
})
}
});
setInterval("$.show()",1000);
});
Demo:
http://jsfiddle.net/VpKw2/

Why don't you use setInterval()?
Edit:
Your animation bounces once, then stops, because...
You trigger the margin=20 part.
Upon completeness, another animation is scheduled: margin=0.
That's it. It doesn't loop because nothing is rescheduled to happen after the first pass.
Read the documentation on setInterval(): it's a function that let's you call another function at fixed (in milliseconds) intervals.
If you still want to do it as above, you must fix the problem I pointed out. Try thinking your way around it, and I'll help if you can't figure it out :).
Cheers.

Setup a bounce function that will continue the animation, either moving the element left or right:
function bounce(elm, leftZero) {
var px = leftZero ? '0px' : '20px';
elm.animate({ marginLeft : px}, {
duration: 200,
complete:function(){
//Continue bouncing
setTimeout(function(){
bounce(elm, !left);
},1);
}
});
}
$(".jquery_bounce").ready(function(){
$("img", this).each(function(){
//Start bouncing
bounce($(this), false);
});
})
});

JQuery CSS Animation

I am having trouble getting this animation to work.
$("#selectedTime").stop().animate({
"margin-left": "-=470px"
},"fast", function() {
$(this).css({ "margin-left": "620px"
})}).animate({
"margin-left": "-=470px"
},"fast");
I am sliding the div to the left 470px, jumping to 620px and sliding another 470px to the left. $(this).css({ "marginLeft": "620px" does not seem to be working.
The initial margin-left is 150px. After running the script it is -790px. (150-470-470).

To start, you've got syntax errors:
$("#selectedTime").stop().animate({
"margin-left": "-=470px"
},"fast", function() { // ↓↓↓ here
$(this).css({ "margin-left": "620px"});
}).animate({
"margin-left": "-=470px"
},"fast");
$("#selectedTime")
.stop()
.animate({"margin-left": "-=470px"}, "fast")
.animate({"margin-left": "620px"}, 0)
.animate({"margin-left": "-=470px"}, "fast");
Demo: http://jsfiddle.net/mattball/j7rcr/