diff --git a/js/article.js b/js/article.js
index ae3745d..0256821 100644
--- a/js/article.js
+++ b/js/article.js
@@ -7076,8 +7076,9 @@ function getCitations(doi, a_ID) {
         success: function (result) {
             if (result.code == 0) {
                 var str1 = `<div style="text-align:center;" class="WosNumber quoteNumber"> ${result.data.list && result.data.list.length > 0 ? result.data.list.length : 0}</div>`
+              
+                $('.Wos .quote-content1').html(str1)  
                 var journalCiteStr = ""
-                $('.Wos .quote-content1').html(str1)
                 var arr = result.data.list
                 for (let i in arr) {
                     journalCiteStr += ` <div style="margin:10px 0;display:flex;"><p style="margin-right:10px;">${Number(i) + 1}.</p>
@@ -7185,9 +7186,10 @@ function getCitations(doi, a_ID) {
         success: function (result) {
             if (result.code == 0) {
                 var str1 = `<div style="text-align:center;" class="crossrefNumber quoteNumber"> ${result.data && result.data.length > 0 ? result.data.length : 0}</div>`
-                var journalCiteStr = ""
+               
                 $('.Crossref .quote-content1').html(str1)
-                var arr = result.data
+                var arr = result.data 
+                var journalCiteStr = ""
                 for (let i in arr) {
                     journalCiteStr += ` <div style="margin:10px 0;display:flex;"><p style="margin-right:10px;">${Number(i) + 1}.</p>
                 <div>
diff --git a/js/article_v2.js b/js/article_v2.js
index 9e870ec..f2c6b7c 100644
--- a/js/article_v2.js
+++ b/js/article_v2.js
@@ -35,6 +35,21 @@ width: 23%;
 .pos_ter>div:nth-child(3) {
 width: 23%;
 }
+.pos_ter>a {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.pos_ter>a>img {
+    min-width: 260px;
+    margin-top: -10px;
+}
+.pos_ter>div:nth-child(3)>a:nth-child(1){
+margin-left: calc((100% - 160px - 55px - 20px)/2);
+}
+.pos_ter>div:nth-child(1)>div:nth-child(1){
+margin-left: calc((100% - 190px - 65px)/2) !important;
+}
             
 .pos_ter>div:nth-child(4) {
     width: 23%; overflow:hidden;
@@ -284,14 +299,14 @@ function renderCitations(citations, doi) {
                 <li class="article-quote-box Wos">
                     <p class="quote-source">Wos</p>
                     <div class="quote-content quote-content1">
-                        <div class="quoteNumber WosNumber" style="text-align:center;">${citations.wos.length}</div>
+                        <div class="quoteNumber WosNumber" style="text-align:center;cursor: pointer;">${citations.wos.length}</div>
                     </div>
                 </li>
                 <li class="article-quote-box DimensionsBadge">
                     <a href="https://badge.dimensions.ai/details/doi/${doi}" target="_blank">
                         <p class="quote-source">Dimensions Badge</p>
                         <div class="quote-content">
-                            <div class="quoteNumber" style="text-align:center;">${citations.dimensions}</div>
+                            <div class="quoteNumber" style="text-align:center;cursor: pointer;">${citations.dimensions}</div>
                         </div>
                     </a>
                 </li>
@@ -299,14 +314,14 @@ function renderCitations(citations, doi) {
                     <a href="https://scite.ai/reports/${doi}" target="_blank">
                         <p class="quote-source">Scite Badge (Wiley)</p>
                         <div class="quote-content quote-content1">
-                            <div class="quoteNumber" style="text-align:center;">${citations.scite}</div>
+                            <div class="quoteNumber" style="text-align:center;cursor: pointer;">${citations.scite}</div>
                         </div>
                     </a>
                 </li>
                 <li class="article-quote-box Crossref" style="margin-right: 0;">
                     <p class="quote-source">Crossref</p>
                     <div class="quote-content quote-content1">
-                        <div class="quoteNumber crossrefNumber" style="text-align:center;">${citations.crossref && citations.crossref.length > 0 ? citations.crossref.length : 0}</div>
+                        <div class="quoteNumber crossrefNumber" style="text-align:center;cursor: pointer;">${citations.crossref && citations.crossref.length > 0 ? citations.crossref.length : 0}</div>
                     </div>
                 </li>
             </ul>
@@ -327,6 +342,109 @@ function renderCitations(citations, doi) {
     $('#ArticleCitations').css('display', 'block');  // 设置显示样式
     $('.article-quote').html(str); // 设置 HTML 内容
 
+   
+
+    if (citations.wos && citations.wos.length > 0) {
+        var journalCiteStr1 = ""
+       
+        for (let i in citations.wos) {
+            journalCiteStr1 += ` <div style="margin:10px 0;display:flex;"><p style="margin-right:10px;">${Number(i) + 1}.</p>
+        <div>
+        <p style="display: block;
+        font-size: 13px;
+        margin-bottom: 3px;">${citations.wos[i].article_name}</p>
+        
+        <p>
+        <span style="color: #a2b1b6;
+        font-size: 13px;"> ${citations.wos[i].journal_name},
+        <span style="color: #a2b1b6;
+        font-size: 13px;">${citations.wos[i].author ? `${citations.wos[i].author},` : ''} ${citations.wos[i].journal_name}${citations.wos[i].vol ? `${citations.wos[i].vol},` : ''}
+        </span></span>
+       
+        <span style="margin-left:5px;color:#205493;">
+        <a 
+            target="_blank"
+            href="https://doi.org/${citations.wos[i].doi}">https://doi.org/${citations.wos[i].doi}</a>                </span></p></div>
+        
+        </div>`
+        }
+        $('.WosNumber').click(function () {
+            var infoStr1 = `Citations registered in Wos`
+            $('#framed_div .info-box').html(infoStr1);
+            $('#framed_div .quote-content').html(journalCiteStr1);
+            $('#framed_div').addClass('isWos');
+
+            if ($('#framed_div').hasClass('openCrossref')) {
+
+                if ($('#framed_div').hasClass('isCrossref')) {
+
+                    $('#framed_div').removeClass('isCrossref');
+                    $('#framed_div').removeClass('openCrossref');
+                    setTimeout(() => {
+                        $('#framed_div').addClass('openCrossref');
+                    }, 100)
+
+                } else {
+                    $('#framed_div').removeClass('openCrossref');
+                    $('#framed_div').removeClass('isWos');
+                }
+
+            } else {
+                $('#framed_div').addClass('isWos');
+                $('#framed_div').addClass('openCrossref');
+            }
+
+
+        })
+    }
+
+    if (citations.crossref && citations.crossref.length > 0) {
+        var journalCiteStr = ""
+        for (let i in citations.crossref) {
+            journalCiteStr += ` <div style="margin:10px 0;display:flex;"><p style="margin-right:10px;">${Number(i) + 1}.</p>
+        <div>
+        <p style="display: block;
+        font-size: 13px;
+        margin-bottom: 3px;">${citations.crossref[i].article_title}</p>
+        
+        <p>
+        <span style="color: #a2b1b6;
+        font-size: 13px;"> ${citations.crossref[i].journal_title},
+        <span style="margin-left:5px">
+        ${citations.crossref[i].year}</span></span>
+       
+        <span style="margin-left:5px;color:#205493;">
+        <a 
+            target="_blank"
+            href="https://doi.org/${citations.crossref[i].doi}">https://doi.org/${citations.crossref[i].doi}</a>                </span></p></div>
+        
+        </div>`
+        }
+        $('.crossrefNumber').click(function () {
+            var infoStr = `Citations registered in CrossRef`
+            $('#framed_div .info-box').html(infoStr);
+            $('#framed_div .quote-content').html(journalCiteStr); $('#framed_div').addClass('isCrossref');
+            if ($('#framed_div').hasClass('openCrossref')) {
+
+                if ($('#framed_div').hasClass('isWos')) {
+
+                    $('#framed_div').removeClass('isWos');
+                    $('#framed_div').removeClass('openCrossref');
+                    $('#framed_div').addClass('isCrossref');
+                    setTimeout(() => {
+                        $('#framed_div').addClass('openCrossref');
+                    }, 100)
+                } else {
+                    $('#framed_div').removeClass('openCrossref');
+                    $('#framed_div').removeClass('isCrossref');
+                }
+
+            } else {
+                $('#framed_div').addClass('isCrossref');
+                $('#framed_div').addClass('openCrossref');
+            }
+        })
+    }
 }
 
 /* 相关引用次数 */