Colorbox を サイトに、組み込もうとしています。しかし、すでにサイトに組み込んであるTwitterのPublishが、エラーを出します。何かご存知の方がいらっしゃれば、教えていただけないでしょうか。
jQueryバージョン https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
ソースを追記します。どうか、よろしくお願いします。
組み込まれているTwitterのウォジェットhttps://publish.twitter.com/
javascript
1<a class="twitter-timeline" href="https://twitter.com/penguin520?ref_src=twsrc%5Etfw">Tweets by penguin520</a> 2<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
現在のコード
html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5<title></title> 6 <meta charset="UTF-8"> 7 <meta name="description" content=""> 8 <meta name="keywords" content=""> 9 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 10 <script src="jquery.colorbox.js"></script> 11 <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> 12 <meta name="viewport" content="width=device-width, user-scalable=yes, maximum-scale=1"> 13 <link rel="stylesheet" href="colorbox.css" /> 14 <link href="style.css" rel="stylesheet" type="text/css" media="screen,print"> 15 16 <script> 17 $(document).ready(function(){ 18 //Examples of how to assign the Colorbox event to elements 19 $(".group1").colorbox({rel:'group1'}); 20 $(".group2").colorbox({rel:'group2', transition:"fade"}); 21 $(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"}); 22 $(".group4").colorbox({rel:'group4', slideshow:true}); 23 $(".ajax").colorbox(); 24 $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390}); 25 $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409}); 26 $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"}); 27 $(".inline").colorbox({inline:true, width:"50%"}); 28 $(".callbacks").colorbox({ 29 onOpen:function(){ alert('onOpen: colorbox is about to open'); }, 30 onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, 31 onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, 32 onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, 33 onClosed:function(){ alert('onClosed: colorbox has completely closed'); } 34 }); 35 36 $('.non-retina').colorbox({rel:'group5', transition:'none'}) 37 $('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true}); 38 39 //Example of preserving a JavaScript event for inline calls. 40 $("#click").click(function(){ 41 $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here."); 42 return false; 43 }); 44 }); 45 </script> 46 47</head> 48 49<body> 50 51<main> 52 <div> 53 <p><a class='youtube' href="http://www.youtube.com/embed/9VWtyR87w-g?rel=0&wmode=transparent"><img src="move.png" alt="Youtube"></a></p> 54 </div> 55</main> 56 57<a class="twitter-timeline" href="https://twitter.com/penguin520?ref_src=twsrc%5Etfw">Tweets by penguin520</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 58 59 60<script type="text/javascript"> 61 62 $(function() { 63 var topBtn = $('#page-top'); 64 topBtn.hide(); 65 $(window).scroll(function () { 66 if ($(this).scrollTop() > 600) { 67 topBtn.fadeIn(); 68 } else { 69 topBtn.fadeOut(); 70 } 71 }); 72 topBtn.click(function () { 73 $('body,html').animate({ 74 scrollTop: 0 75 }, 500); 76 return false; 77 }); 78 }); 79 80 $(document).ready(function() { 81 $("#pop").click(function () { 82 $("#popNav").slideToggle('fast'); 83 }); 84 }); 85 86</script> 87 88</body> 89 90</html>
回答1件
あなたの回答
tips
プレビュー