求一个h5实现多个气球下落时 点击气球 气泡爆裂的js/jquery代码

Posted 2023-05-13

多个气球下落已经实现了 就剩下点击下落气球时 气球爆裂的效果

参考技术A <style>
*margin: 0;padding: 0;
.wrapwidth: 500px;height: 500px;border: 1px solid #ccc;background: #eee;margin: 30px auto;position: relative;overflow: hidden;
.boxposition: absolute;top: 510px;width: 50px;height: 50px;text-align: center;line-height: 50px;font-size: 22px;font-weight: bold;color: #666;
</style>
<div class="wrap">

</div>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script>
var qiqiu=
num:0,
wrap: $(".wrap"),
box:null,
createStr: function()
var s = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()-_ []<>~`+=,.;:/?|\"";
return s[parseInt(s.length*Math.random())];
,
create: function()
var ele = $("<div class='box' />").appendTo(this.wrap);
ele.html(this.createStr());
ele.data("code",ele.html().charCodeAt(0));

ele.css(
"left": (this.wrap.width()-50)*Math.random()
);
if(!this.box)
this.box = ele;
else
this.box = this.box.add(ele);

setTimeout(function()
qiqiu.create()
,2000);
,
move: function()
this.timer = setInterval(function()
qiqiu.box.css(
top: "-=3"
);
,25);
,
stop: function()
clearInterval(this.timer);
,
destroy: function(inx)
this.box.eq(inx).css(
"color":"red",
"background":"#ffe"
).fadeOut(100,function()
qiqiu.box.eq(inx).remove();
);
,
hit: function(s)
this.box.each(function(inx,ele)
if($(this).data("code")===s)
qiqiu.destroy(inx);
return false;

);
,
init: function()
$(document).on(
"keypress": function(e)
qiqiu.hit(e.which);
return false;

);
this.create();
this.move();


;
qiqiu.init();
</script>追问

你确定可以吗 只有一个div

本回答被提问者和网友采纳

312戳气球

题目：有 n 个气球，编号为0 到 n-1，每个气球上都标有一个数字，这些数字存在数组 nums 中。
现在要求你戳破所有的气球。每当你戳破一个气球 i 时，你可以获得 nums[left] * nums[i] * nums[right] 个硬币。 这里的 left 和 right 代表和 i 相邻的两个气球的序号。注意当你戳破了气球 i 后，气球 left 和气球 right 就变成了相邻的气球。求所能获得硬币的最大数量。
说明:你可以假设 nums[-1] = nums[n] = 1，但注意它们不是真实存在的所以并不能被戳破。0 ≤ n ≤ 500, 0 ≤ nums[i] ≤ 100

来源：https://leetcode-cn.com/problems/burst-balloons/

法一：自己的代码  动态规划

思路：这是一道区间dp题，与1000合并石头的最低成本方法类似，都是由内到外进行数据记录，关键是写出动态规划方程，注意使用动态方程的时候一定不要拘泥于只用一维dp，要根据题意进行选择，本题要求的是数组从0到n的最大值，而0和n就是决定最后结果的两个变量，故用它们定义二维动态数组，从i到j的最大值是由未戳破的k加上其余已经戳破的数组的和决定的，由此写出如下的状态转移方程.

dp[i][j] = max(nums[i-1] * nums[k] * nums[j+1] + dp[i][k-1] + dp[k+1][j] for k in range(i,j+1))

要学会斜变量dp矩阵的方法.

from typing import List
class Solution:
    def maxCoins(self, nums: List[int]) -> int:
        ans = 0
        # 为了方便后续写状态转移方程，添加边界条件
        nums = [1] + nums + [1]
        size = len(nums)
        dp  = [[0] * size for i in range(size)]
        # 这里提供了一个斜遍历矩阵的方法，start用于控制起始位置，引入变量i进行控制行索引
        for start in range(1,size):
            i = 1
            print(‘-‘ * 20)
            for j in range(start,size-1):
                print(i,j)
                # 最开始的这个状态转移方程是错的，只考虑了i，j数据两边未戳破的情况，事实上中间也有可能未戳破，与两边已经戳破的进行合并.
                # dp[i][j] = max(nums[i-1] * nums[i] * nums[j+1] + dp[i+1][j],
                #                nums[i-1] * nums[j] * nums[j+1] + dp[i][j-1])
                dp[i][j] = max(nums[i-1] * nums[k] * nums[j+1] + dp[i][k-1] + dp[k+1][j]
                               for k in range(i,j+1))
                i += 1
        print(dp)
        return (dp[1][size-2])
if __name__ == ‘__main__‘:
    duixiang = Solution()
    # a = duixiang.maxCoins([3,1,5,8])
    a = duixiang.maxCoins([35, 16, 83, 87, 84, 59, 48, 41])
    print(a)

View Code

ttt