質問するログイン新規登録

質問編集履歴

2

Twitterのウォジェットについて追記

2018/01/19 02:30

投稿

penguin520
penguin520

スコア345

title CHANGED
File without changes
body CHANGED
@@ -2,8 +2,18 @@
2
2
 
3
3
  [Colorbox](http://www.jacklmoore.com/colorbox/) を サイトに、組み込もうとしています。しかし、すでにサイトに組み込んである[TwitterのPublish](https://publish.twitter.com/)が、エラーを出します。何かご存知の方がいらっしゃれば、教えていただけないでしょうか。
4
4
 
5
+ jQueryバージョン https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
6
+
5
7
  ソースを追記します。どうか、よろしくお願いします。
8
+   
9
+   
6
-
10
+ 組み込まれているTwitterのウォジェット[https://publish.twitter.com/](https://publish.twitter.com/)
11
+ ```javascript
12
+ <a class="twitter-timeline" href="https://twitter.com/penguin520?ref_src=twsrc%5Etfw">Tweets by penguin520</a>
13
+ <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
14
+ ```
15
+  
16
+ 現在のコード
7
17
  ```html
8
18
  <!DOCTYPE html>
9
19
  <html lang="ja">
@@ -61,7 +71,7 @@
61
71
  </div>
62
72
  </main>
63
73
 
64
- <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>>
74
+ <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>
65
75
 
66
76
 
67
77
  <script type="text/javascript">

1

ソースの追記

2018/01/19 02:30

投稿

penguin520
penguin520

スコア345

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