如何仅在背景图像部分上方设置背景动画？

Question

我提供了背景动画示例。在片段中，图像上方有星形动画。我的问题是动画重叠到页面的剩余部分。我希望这个动画只在图像上方。我不希望动画在图像下方的红色背景部分之上。

Animation example

6h3tagsv

Answer 1

将overflow:hidden添加到.visual-banner将解决此问题。

.visual-banner {
   /* other props */
   overflow:hidden;
}

Updated fiddle

Answer 2

由于您的所有星标都是 package eduard.alarmamotivationala; import android.content.res.Resources; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.widget.ImageView; import java.util.Random; public class MainActivity extends AppCompatActivity { int[] cards = {R.drawable.i1, R.drawable.i2, R.drawable.i3}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // initializing the image view ImageView m_imgRandom = (ImageView) findViewById(R.id.imgRandom); // choosing a random number from 0 to 2 int n = new Random().nextInt(3); // choosing the random image from cards array using the random number m_imgRandom.setImageResource(cards[n]); } } ，并且您的动画将其位置更改为position: absolute其中一个解决方案，因此请将.visual-banner添加到overflow: hidden。