|
|
<!DOCTYPE html> |
|
|
<html lang="zh-CN"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>每日AI Paper - AI论文精选</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<script> |
|
|
tailwind.config = { |
|
|
theme: { |
|
|
extend: { |
|
|
colors: { |
|
|
primary: '#4F46E5', |
|
|
secondary: '#10B981', |
|
|
dark: '#1F2937', |
|
|
light: '#F9FAFB' |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Inter', sans-serif; |
|
|
background-color: #F3F4F6; |
|
|
transition: background-color 0.3s; |
|
|
} |
|
|
|
|
|
.dark-mode { |
|
|
background-color: #111827; |
|
|
color: #F9FAFB; |
|
|
} |
|
|
|
|
|
.paper-card { |
|
|
transition: transform 0.3s, box-shadow 0.3s; |
|
|
perspective: 1000px; |
|
|
} |
|
|
|
|
|
.paper-card:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); |
|
|
} |
|
|
|
|
|
.card-inner { |
|
|
transition: transform 0.6s; |
|
|
transform-style: preserve-3d; |
|
|
} |
|
|
|
|
|
.paper-card:hover .card-inner { |
|
|
transform: rotateY(10deg); |
|
|
} |
|
|
|
|
|
.category-badge { |
|
|
transition: all 0.3s; |
|
|
} |
|
|
|
|
|
.category-badge:hover { |
|
|
transform: scale(1.05); |
|
|
} |
|
|
|
|
|
.fade-in { |
|
|
animation: fadeIn 0.5s ease-in; |
|
|
} |
|
|
|
|
|
@keyframes fadeIn { |
|
|
from { opacity: 0; transform: translateY(10px); } |
|
|
to { opacity: 1; transform: translateY(0); } |
|
|
} |
|
|
|
|
|
.hero { |
|
|
background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%); |
|
|
} |
|
|
|
|
|
.detail-view { |
|
|
background: #FFFFFF; |
|
|
} |
|
|
|
|
|
.dark-mode .detail-view { |
|
|
background: #1F2937; |
|
|
} |
|
|
|
|
|
.back-to-list { |
|
|
transition: all 0.3s; |
|
|
} |
|
|
|
|
|
.back-to-list:hover { |
|
|
transform: translateX(-5px); |
|
|
} |
|
|
|
|
|
.paper-content { |
|
|
max-height: 0; |
|
|
overflow: hidden; |
|
|
transition: max-height 0.5s ease-out; |
|
|
} |
|
|
|
|
|
.paper-content.expanded { |
|
|
max-height: 1000px; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-100"> |
|
|
|
|
|
<nav class="bg-white dark:bg-gray-900 shadow-lg sticky top-0 z-50"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="flex justify-between h-16"> |
|
|
<div class="flex items-center"> |
|
|
<div class="flex-shrink-0 flex items-center"> |
|
|
<i class="fas fa-book-open text-primary text-2xl mr-2"></i> |
|
|
<span class="text-xl font-bold text-gray-900 dark:text-white">每日AI Paper</span> |
|
|
</div> |
|
|
<div class="hidden md:ml-6 md:flex md:space-x-8"> |
|
|
<a href="#" class="border-b-2 border-primary text-gray-900 dark:text-white px-1 pt-1 text-sm font-medium">首页</a> |
|
|
<a href="#" class="text-gray-500 hover:border-gray-300 hover:text-gray-700 dark:text-gray-300 dark:hover:text-white px-1 pt-1 text-sm font-medium">往期论文</a> |
|
|
<a href="#" class="text-gray-500 hover:border-gray-300 hover:text-gray-700 dark:text-gray-300 dark:hover:text-white px-1 pt-1 text-sm font-medium">收藏夹</a> |
|
|
<a href="#" class="text-gray-500 hover:border-gray-300 hover:text-gray-700 dark:text-gray-300 dark:hover:text-white px-1 pt-1 text-sm font-medium">关于我们</a> |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<div class="flex-shrink-0"> |
|
|
<button class="relative inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-primary hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"> |
|
|
<i class="fas fa-plus mr-2"></i> 提交论文 |
|
|
</button> |
|
|
</div> |
|
|
<div class="ml-4 flex items-center md:ml-6"> |
|
|
<button id="theme-toggle" class="p-2 rounded-full text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-white focus:outline-none"> |
|
|
<i class="fas fa-moon" id="theme-icon"></i> |
|
|
</button> |
|
|
<div class="ml-3 relative"> |
|
|
<div class="relative"> |
|
|
<button class="h-8 w-8 rounded-full bg-gray-200 flex items-center justify-center"> |
|
|
<i class="fas fa-user text-gray-600"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
|
|
|
<header class="hero"> |
|
|
<div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8"> |
|
|
<div class="text-center"> |
|
|
<h1 class="text-4xl font-extrabold text-white sm:text-5xl sm:tracking-tight lg:text-6xl"> |
|
|
探索人工智能前沿研究 |
|
|
</h1> |
|
|
<p class="mt-6 max-w-2xl mx-auto text-xl text-indigo-100"> |
|
|
每日精选AI领域最新论文，涵盖机器学习、计算机视觉、自然语言处理等方向 |
|
|
</p> |
|
|
<div class="mt-10 max-w-2xl mx-auto"> |
|
|
<div class="flex rounded-md shadow-sm"> |
|
|
<input type="text" class="flex-1 min-w-0 block w-full px-4 py-3 rounded-l-md text-base focus:outline-none" placeholder="搜索论文标题、作者或关键词..."> |
|
|
<button class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-r-md text-white bg-secondary hover:bg-emerald-700 focus:outline-none"> |
|
|
<i class="fas fa-search mr-2"></i> 搜索 |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<main class="py-12"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
|
|
|
<div class="flex flex-wrap justify-center gap-8 mb-12"> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-primary hover:text-white dark:hover:bg-primary px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
全部论文 |
|
|
</button> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-blue-500 hover:text-white dark:hover:bg-blue-500 px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
机器学习 |
|
|
</button> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-green-500 hover:text-white dark:hover:bg-green-500 px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
计算机视觉 |
|
|
</button> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-yellow-500 hover:text-white dark:hover:bg-yellow-500 px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
自然语言处理 |
|
|
</button> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-red-500 hover:text-white dark:hover:bg-red-500 px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
强化学习 |
|
|
</button> |
|
|
<button class="category-badge bg-white dark:bg-gray-800 hover:bg-purple-500 hover:text-white dark:hover:bg-purple-500 px-4 py-2 rounded-full shadow-sm font-medium transition-all"> |
|
|
生成模型 |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-8 flex items-center"> |
|
|
<i class="fas fa-star text-yellow-500 mr-3"></i> 今日精选论文 |
|
|
</h2> |
|
|
<div class="grid grid-cols-1 gap-8"> |
|
|
<div class="paper-card bg-white dark:bg-gray-800 rounded-2xl shadow-xl overflow-hidden"> |
|
|
<div class="card-inner"> |
|
|
<div class="md:flex"> |
|
|
<div class="md:flex-shrink-0 md:w-1/3"> |
|
|
<div class="h-64 w-full bg-gradient-to-r from-blue-400 to-indigo-600 flex items-center justify-center"> |
|
|
<i class="fas fa-robot text-white text-5xl opacity-30"></i> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-8 md:w-2/3"> |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<div class="uppercase tracking-wide text-sm text-primary font-bold">今日论文</div> |
|
|
<h3 class="mt-2 text-2xl font-bold text-gray-900 dark:text-white">基于Transformer的视觉语言模型统一框架</h3> |
|
|
<p class="mt-3 text-gray-600 dark:text-gray-300"> |
|
|
作者：李华等，机构：清华大学人工智能实验室 |
|
|
</p> |
|
|
<div class="mt-4 flex flex-wrap gap-2"> |
|
|
<span class="px-3 py-1 bg-blue-100 text-blue-800 text-xs font-medium rounded-full dark:bg-blue-900 dark:text-blue-100">计算机视觉</span> |
|
|
<span class="px-3 py-1 bg-green-100 text-green-800 text-xs font-medium rounded-full dark:bg-green-900 dark:text-green-100">自然语言处理</span> |
|
|
<span class="px-3 py-1 bg-purple-100 text-purple-800 text-xs font-medium rounded-full dark:bg-purple-900 dark:text-purple-100">多模态学习</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex-shrink-0"> |
|
|
<button class="text-gray-400 hover:text-primary"> |
|
|
<i class="far fa-bookmark text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-6"> |
|
|
<p class="text-gray-700 dark:text-gray-300"> |
|
|
本文提出了一种统一的Transformer架构，能够同时处理多种视觉语言任务，包括图像描述、视觉问答和跨模态检索等。通过引入自适应的多模态融合机制，在多个基准数据集上取得了最先进的性能。 |
|
|
</p> |
|
|
<div class="mt-6 flex items-center"> |
|
|
<button class="view-detail-btn bg-primary hover:bg-indigo-700 text-white text-sm font-medium py-2 px-4 rounded-lg transition duration-300 ease-in-out transform hover:-translate-y-1"> |
|
|
查看详情 |
|
|
</button> |
|
|
<div class="ml-4 flex items-center text-sm text-gray-500 dark:text-gray-400"> |
|
|
<i class="far fa-calendar-alt mr-1"></i> |
|
|
<span>2023年10月15日</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mb-16"> |
|
|
<h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-8 flex items-center"> |
|
|
<i class="fas fa-history text-secondary mr-3"></i> 往期论文 |
|
|
</h2> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" id="paper-list"> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex justify-center mt-12"> |
|
|
<nav class="relative z-0 inline-flex rounded-md shadow-sm -space-x-px" aria-label="Pagination"> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 rounded-l-md border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-700"> |
|
|
上一页 |
|
|
</a> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-700"> |
|
|
1 |
|
|
</a> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 border border-gray-300 bg-primary text-white text-sm font-medium"> |
|
|
2 |
|
|
</a> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-700"> |
|
|
3 |
|
|
</a> |
|
|
<span class="relative inline-flex items-center px-4 py-2 border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500"> |
|
|
... |
|
|
</span> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-700"> |
|
|
8 |
|
|
</a> |
|
|
<a href="#" class="relative inline-flex items-center px-4 py-2 rounded-r-md border border-gray-300 bg-white dark:bg-gray-800 text-sm font-medium text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-700"> |
|
|
下一页 |
|
|
</a> |
|
|
</nav> |
|
|
</div> |
|
|
</div> |
|
|
</main> |
|
|
|
|
|
|
|
|
<div id="detail-page" class="fixed inset-0 bg-black bg-opacity-75 z-50 hidden overflow-y-auto"> |
|
|
<div class="min-h-screen flex items-center justify-center p-4"> |
|
|
<div class="detail-view bg-white dark:bg-gray-800 rounded-2xl shadow-2xl w-full max-w-4xl mx-auto"> |
|
|
<div class="p-8"> |
|
|
<div class="flex justify-between items-start mb-6"> |
|
|
<button class="back-to-list text-gray-500 hover:text-primary dark:text-gray-400 dark:hover:text-white font-medium"> |
|
|
<i class="fas fa-arrow-left mr-2"></i> 返回列表 |
|
|
</button> |
|
|
<div class="flex space-x-4"> |
|
|
<button class="text-gray-400 hover:text-primary"> |
|
|
<i class="far fa-bookmark text-xl"></i> |
|
|
</button> |
|
|
<button class="text-gray-400 hover:text-primary"> |
|
|
<i class="fas fa-share-alt text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-8"> |
|
|
<h1 class="text-3xl font-bold text-gray-900 dark:text-white mb-4" id="detail-title">基于Transformer的视觉语言模型统一框架</h1> |
|
|
<div class="flex flex-wrap items-center text-gray-600 dark:text-gray-300 mb-4"> |
|
|
<span class="mr-4"><i class="fas fa-user-graduate mr-1"></i> 作者：<span id="detail-author">李华，张明，王涛</span></span> |
|
|
<span class="mr-4"><i class="fas fa-university mr-1"></i> 机构：<span id="detail-institution">清华大学人工智能实验室</span></span> |
|
|
<span><i class="far fa-calendar-alt mr-1"></i> 发布日期：<span id="detail-date">2023年10月15日</span></span> |
|
|
</div> |
|
|
<div class="flex flex-wrap gap-2 mb-6"> |
|
|
<span class="px-3 py-1 bg-blue-100 text-blue-800 text-sm font-medium rounded-full dark:bg-blue-900 dark:text-blue-100">计算机视觉</span> |
|
|
<span class="px-3 py-1 bg-green-100 text-green-800 text-sm font-medium rounded-full dark:bg-green-900 dark:text-green-100">自然语言处理</span> |
|
|
<span class="px-3 py-1 bg-purple-100 text-purple-800 text-sm font-medium rounded-full dark:bg-purple-900 dark:text-purple-100">多模态学习</span> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-100 dark:bg-gray-700 rounded-xl p-6 mb-6"> |
|
|
<div class="flex items-center"> |
|
|
<div class="flex-shrink-0"> |
|
|
<div class="h-16 w-16 bg-gradient-to-r from-blue-400 to-indigo-600 rounded-lg flex items-center justify-center"> |
|
|
<i class="fas fa-file-alt text-white text-xl"></i> |
|
|
</div> |
|
|
</div> |
|
|
<div class="ml-4"> |
|
|
<h3 class="text-lg font-medium text-gray-900 dark:text-white">论文摘要</h3> |
|
|
<div class="mt-2 text-gray-700 dark:text-gray-300" id="detail-abstract"> |
|
|
本文提出了一种统一的Transformer架构，能够同时处理多种视觉语言任务，包括图像描述、视觉问答和跨模态检索等。通过引入自适应的多模态融合机制，在多个基准数据集上取得了最先进的性能。实验结果表明，我们的模型在保持参数效率的同时，显著提高了跨模态任务的泛化能力。 |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="paper-content" id="paper-content"> |
|
|
<h2 class="text-xl font-bold text-gray-900 dark:text-white mb-4">研究内容</h2> |
|
|
<div class="prose text-gray-700 dark:text-gray-300 max-w-none mb-8"> |
|
|
<p>近年来，视觉语言多模态学习已成为人工智能领域的研究热点。然而，现有的方法大多针对特定任务设计专用模型，缺乏通用性和灵活性。本文提出了一种新的统一框架VL-Transformer，能够同时处理多种视觉语言任务。</p> |
|
|
|
|
|
<h3 class="font-bold mt-6 mb-3">方法概述</h3> |
|
|
<p>VL-Transformer的核心架构包含三个主要组成部分：</p> |
|
|
<ul class="list-disc pl-5 space-y-2 mt-2"> |
|
|
<li>视觉编码器：使用预训练的视觉Transformer模型提取图像特征</li> |
|
|
<li>文本编码器：基于BERT的文本表示模型</li> |
|
|
<li>自适应融合模块：动态调整视觉和文本特征的交互方式</li> |
|
|
</ul> |
|
|
|
|
|
<h3 class="font-bold mt-6 mb-3">创新点</h3> |
|
|
<p>本文的主要创新点包括：</p> |
|
|
<ol class="list-decimal pl-5 space-y-2 mt-2"> |
|
|
<li>任务自适应注意力机制：根据不同任务类型动态调整注意力机制</li> |
|
|
<li>跨模态共享参数：在视觉和语言模型之间共享部分参数，提高参数效率</li> |
|
|
<li>渐进式训练策略：采用多阶段训练策略，逐步提升模型性能</li> |
|
|
</ol> |
|
|
|
|
|
<h3 class="font-bold mt-6 mb-3">实验结果</h3> |
|
|
<p>我们在多个基准数据集上进行了实验评估：</p> |
|
|
<div class="overflow-x-auto mt-4"> |
|
|
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700"> |
|
|
<thead class="bg-gray-50 dark:bg-gray-700"> |
|
|
<tr> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider dark:text-gray-300">数据集</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider dark:text-gray-300">任务</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider dark:text-gray-300">准确率(%)</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider dark:text-gray-300">SOTA</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody class="bg-white divide-y divide-gray-200 dark:bg-gray-800 dark:divide-gray-700"> |
|
|
<tr> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">COCO</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">图像描述</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">85.2</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-green-600 font-medium">+2.2%</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">VQA v2</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">视觉问答</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">72.8</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-green-600 font-medium">+1.5%</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">Flickr30K</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">跨模态检索</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700 dark:text-gray-300">78.4</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-green-600 font-medium">+3.1%</td> |
|
|
</tr> |
|
|
</tbody> |
|
|
</table> |
|
|
</div> |
|
|
|
|
|
<h3 class="font-bold mt-6 mb-3">结论</h3> |
|
|
<p>本文提出的VL-Transformer框架在多个视觉语言任务上实现了统一建模，并取得了最先进的性能。实验结果表明，自适应融合机制和共享参数策略能够有效提升模型的泛化能力。未来工作将探索更多任务和更大规模的数据集。</p> |
|
|
</div> |
|
|
|
|
|
<div class="flex flex-wrap gap-4 mt-8"> |
|
|
<a href="#" class="inline-flex items-center px-4 py-2 bg-primary hover:bg-indigo-700 text-white text-sm font-medium rounded-lg transition"> |
|
|
<i class="fas fa-file-pdf mr-2"></i> PDF全文 |
|
|
</a> |
|
|
<a href="#" class="inline-flex items-center px-4 py-2 bg-gray-200 hover:bg-gray-300 text-gray-800 dark:text-gray-100 dark:bg-gray-700 dark:hover:bg-gray-600 text-sm font-medium rounded-lg transition"> |
|
|
<i class="fab fa-github mr-2"></i> 代码仓库 |
|
|
</a> |
|
|
<a href="#" class="inline-flex items-center px-4 py-2 bg-gray-200 hover:bg-gray-300 text-gray-800 dark:text-gray-100 dark:bg-gray-700 dark:hover:bg-gray-600 text-sm font-medium rounded-lg transition"> |
|
|
<i class="fas fa-video mr-2"></i> 视频讲解 |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<button class="expand-btn mt-8 w-full py-3 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-700 dark:text-gray-300 rounded-lg font-medium transition-all"> |
|
|
<i class="fas fa-chevron-down mr-2"></i> 展开完整内容 |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-800 text-white py-12"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
|
|
<div> |
|
|
<h3 class="text-lg font-bold mb-4">每日AI Paper</h3> |
|
|
<p class="text-gray-400 mb-4"> |
|
|
专注于人工智能领域最新论文的发布与解读，让前沿研究触手可及。 |
|
|
</p> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="text-gray-400 hover:text-white"> |
|
|
<i class="fab fa-twitter"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white"> |
|
|
<i class="fab fa-github"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white"> |
|
|
<i class="fab fa-linkedin"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white"> |
|
|
<i class="fab fa-weixin"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-bold mb-4">导航</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">首页</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">往期论文</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">论文收藏</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">论文提交</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-bold mb-4">热门分类</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">机器学习</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">计算机视觉</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">自然语言处理</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">强化学习</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white">生成模型</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-bold mb-4">订阅更新</h3> |
|
|
<p class="text-gray-400 mb-4"> |
|
|
订阅我们的邮件列表，获取每日最新论文推送 |
|
|
</p> |
|
|
<div class="flex"> |
|
|
<input type="email" placeholder="您的邮箱地址" class="px-4 py-2 w-full rounded-l-lg focus:outline-none text-gray-800"> |
|
|
<button class="bg-primary hover:bg-indigo-700 px-4 py-2 rounded-r-lg" type="submit"> |
|
|
<i class="fas fa-paper-plane"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="border-t border-gray-700 mt-12 pt-8 text-center text-gray-400"> |
|
|
<p>© 2023 每日AI Paper. 保留所有权利。</p> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
|
|
|
const papers = [ |
|
|
{ |
|
|
id: 1, |
|
|
title: "基于Transformer的视觉语言模型统一框架", |
|
|
author: "李华等", |
|
|
institution: "清华大学人工智能实验室", |
|
|
date: "2023-10-15", |
|
|
categories: ["计算机视觉", "自然语言处理", "多模态学习"], |
|
|
abstract: "本文提出了一种统一的Transformer架构，能够同时处理多种视觉语言任务，包括图像描述、视觉问答和跨模态检索等。通过引入自适应的多模态融合机制，在多个基准数据集上取得了最先进的性能。", |
|
|
content: "详细内容见详情页..." |
|
|
}, |
|
|
{ |
|
|
id: 2, |
|
|
title: "自监督学习在医学图像分析中的应用", |
|
|
author: "王明等", |
|
|
institution: "北京大学医学人工智能研究中心", |
|
|
date: "2023-10-14", |
|
|
categories: ["医学影像", "自监督学习"], |
|
|
abstract: "本研究提出了一种新的自监督学习方法，用于医学图像分割任务。该方法在不需要大量标注数据的情况下，在多个医学影像数据集上达到了接近专业医生的水平。", |
|
|
content: "详细内容见详情页..." |
|
|
}, |
|
|
{ |
|
|
id: 3, |
|
|
title: "深度强化学习在机器人控制中的优化", |
|
|
author: "张强等", |
|
|
institution: "上海交通大学机器人研究所", |
|
|
date: "2023-10-13", |
|
|
categories: ["强化学习", "机器人控制"], |
|
|
abstract: "本文提出了一种新型的深度强化学习算法，用于解决复杂环境下的机器人控制问题。通过引入分层注意力机制，显著提高了算法的训练效率和泛化能力。", |
|
|
content: "详细内容见详情页..." |
|
|
}, |
|
|
{ |
|
|
id: 4, |
|
|
title: "高效Transformer模型压缩技术", |
|
|
author: "陈晓等", |
|
|
institution: "浙江大学人工智能研究所", |
|
|
date: "2023-10-12", |
|
|
categories: ["模型压缩", "Transformer"], |
|
|
abstract: "本研究提出了一种新型的Transformer模型压缩方法，通过知识蒸馏和结构化剪枝技术，在保持模型性能的同时，将模型大小压缩了90%以上。", |
|
|
content: "详细内容见详情页..." |
|
|
}, |
|
|
{ |
|
|
id: 5, |
|
|
title: "多模态情感分析中的跨模态对齐", |
|
|
author: "赵敏等", |
|
|
institution: "复旦大学人工智能实验室", |
|
|
date: "2023-10-11", |
|
|
categories: ["情感分析", "多模态学习"], |
|
|
abstract: "本文提出了一种新的跨模态对齐方法，用于解决文本、语音和视觉信息中的情感分析问题。该方法在多个基准数据集上取得了最先进的性能。", |
|
|
content: "详细内容见详情页..." |
|
|
}, |
|
|
{ |
|
|
id: 6, |
|
|
title: "生成式AI在药物研发中的应用", |
|
|
author: "刘洋等", |
|
|
institution: "中国科学院药物研究所", |
|
|
date: "2023-10-10", |
|
|
categories: ["生成模型", "药物研发"], |
|
|
abstract: "本研究探索了生成式AI在药物研发领域的应用，提出了一种新的分子生成模型，能够高效地生成具有特定性质的分子结构，为药物研发提供了新的可能性。", |
|
|
content: "详细内容见详情页..." |
|
|
} |
|
|
]; |
|
|
|
|
|
|
|
|
function renderPaperList() { |
|
|
const paperList = document.getElementById('paper-list'); |
|
|
paperList.innerHTML = ''; |
|
|
|
|
|
papers.slice(1).forEach(paper => { |
|
|
const paperCard = document.createElement('div'); |
|
|
paperCard.className = 'paper-card bg-white dark:bg-gray-800 rounded-xl shadow-lg overflow-hidden fade-in'; |
|
|
paperCard.innerHTML = ` |
|
|
<div class="card-inner"> |
|
|
<div class="h-48 bg-gradient-to-r from-blue-300 to-indigo-400 flex items-center justify-center"> |
|
|
<i class="fas fa-file-alt text-white text-4xl opacity-30"></i> |
|
|
</div> |
|
|
<div class="p-6"> |
|
|
<div class="flex justify-between"> |
|
|
<div> |
|
|
<h3 class="text-lg font-bold text-gray-900 dark:text-white truncate">${paper.title}</h3> |
|
|
<p class="mt-2 text-sm text-gray-600 dark:text-gray-300">${paper.author} · ${paper.institution}</p> |
|
|
</div> |
|
|
<button class="text-gray-400 hover:text-primary"> |
|
|
<i class="far fa-bookmark"></i> |
|
|
</button> |
|
|
</div> |
|
|
<div class="mt-4 flex flex-wrap gap-2"> |
|
|
${paper.categories.map(cat => |
|
|
`<span class="px-2 py-1 bg-gray-100 text-gray-800 text-xs font-medium rounded-full dark:bg-gray-700 dark:text-gray-200">${cat}</span>` |
|
|
).join('')} |
|
|
</div> |
|
|
<div class="mt-4"> |
|
|
<p class="text-gray-700 dark:text-gray-300 text-sm line-clamp-3">${paper.abstract}</p> |
|
|
</div> |
|
|
<div class="mt-6 flex items-center justify-between"> |
|
|
<button class="view-detail-btn bg-gray-100 hover:bg-gray-200 dark:bg-gray-700 dark:hover:bg-gray-600 text-gray-800 dark:text-white text-xs font-medium py-1.5 px-3 rounded transition" data-id="${paper.id}"> |
|
|
查看详情 |
|
|
</button> |
|
|
<div class="text-xs text-gray-500 dark:text-gray-400"> |
|
|
<i class="far fa-calendar-alt mr-1"></i>${paper.date} |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
`; |
|
|
paperList.appendChild(paperCard); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.view-detail-btn').forEach(btn => { |
|
|
btn.addEventListener('click', function() { |
|
|
const paperId = parseInt(this.getAttribute('data-id')); |
|
|
showPaperDetail(paperId); |
|
|
}); |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function showPaperDetail(paperId) { |
|
|
const paper = papers.find(p => p.id === paperId); |
|
|
if (!paper) return; |
|
|
|
|
|
const detailPage = document.getElementById('detail-page'); |
|
|
document.getElementById('detail-title').textContent = paper.title; |
|
|
document.getElementById('detail-author').textContent = paper.author; |
|
|
document.getElementById('detail-institution').textContent = paper.institution; |
|
|
document.getElementById('detail-date').textContent = paper.date; |
|
|
document.getElementById('detail-abstract').textContent = paper.abstract; |
|
|
|
|
|
detailPage.classList.remove('hidden'); |
|
|
document.body.classList.add('overflow-hidden'); |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('theme-toggle').addEventListener('click', function() { |
|
|
document.body.classList.toggle('dark-mode'); |
|
|
const icon = document.getElementById('theme-icon'); |
|
|
if (document.body.classList.contains('dark-mode')) { |
|
|
icon.classList.remove('fa-moon'); |
|
|
icon.classList.add('fa-sun'); |
|
|
} else { |
|
|
icon.classList.remove('fa-sun'); |
|
|
icon.classList.add('fa-moon'); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('.back-to-list').addEventListener('click', function() { |
|
|
document.getElementById('detail-page').classList.add('hidden'); |
|
|
document.body.classList.remove('overflow-hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('.expand-btn').addEventListener('click', function() { |
|
|
const content = document.getElementById('paper-content'); |
|
|
content.classList.toggle('expanded'); |
|
|
|
|
|
if (content.classList.contains('expanded')) { |
|
|
this.innerHTML = '<i class="fas fa-chevron-up mr-2"></i> 收起内容'; |
|
|
} else { |
|
|
this.innerHTML = '<i class="fas fa-chevron-down mr-2"></i> 展开完整内容'; |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
renderPaperList(); |
|
|
|
|
|
|
|
|
document.querySelector('.paper-card .view-detail-btn').addEventListener('click', function() { |
|
|
showPaperDetail(1); |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=xiaosena/ai" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
