OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

Custom Javascript Code in AMP not working - What 's the Solution?

  • Thread starter Thread starter Aitai
  • Start date Start date
A

Aitai

Guest
I'm trying to implement a custom javascript show/hide toggle function on AMP pages using remote .js file, without success.

Here's an example of the functioning code on a regular webpage: https://japan-translators.saeculii.com/english/services/japanese-translations-police-records.cfm

(Click "RELATED SEARCHES" section)

The same code is used on the corresponding AMP page:https://japan-translators.saeculii.com/english/amp/japanese-translations-police-records.cfm

The code in header:

Code:
<script 
   async custom-element="amp-script" 
   src="https://cdn.ampproject.org/v0/amp-script-0.1.js"
></script>

The .js file:

Code:
function toggle_visibility(id) {
    var e = document.getElementById(id);
    e.style.display = ((e.style.display!='none') ? 'none' : 'block');
}

The amp-script wrapper:


Code:
<amp-script src="https://japan-translators.saeculii.com/technical/commonFiles/javascript/toggle.js">
                                <dd>
                    <a onclick="toggle_visibility('FAQ1');" class="content_link" title="For how long is a Japanese police certificate valid?"><img src="#images_href#arrow_black.gif" width="10" height="10" border="0" title="CLICK TO TOGGLE CONTENT" alt="How do I get an official translation?" /> For how long is a Japanese police certificate valid?</a><br />
                    <div id="FAQ1" style="display:none;">
                    <br /><br />
                    Typically, two years from the date of issue.
                    <br /><br />
                    <u>However</u>, this will depend on where and for what purpose you are submitting your certificate. Therefore, you should inquire directly at the organization that will be evaluating your documents.
                    <hr />
                    <br /><br />
                    </div>
                 </dd>
</amp-script>

Any help would be much appreciated! Thanks in advance.

<p>I'm trying to implement a custom javascript show/hide toggle function on AMP pages using remote .js file, without success.</p>
<p>Here's an example of the functioning code on a regular webpage: <a href="https://japan-translators.saeculii.com/english/services/japanese-translations-police-records.cfm" rel="nofollow noreferrer">https://japan-translators.saeculii.com/english/services/japanese-translations-police-records.cfm</a></p>
<p>(Click "RELATED SEARCHES" section)</p>
<p>The same code is used on the corresponding AMP page:<a href="https://japan-translators.saeculii.com/english/amp/japanese-translations-police-records.cfm" rel="nofollow noreferrer">https://japan-translators.saeculii.com/english/amp/japanese-translations-police-records.cfm</a></p>
<p>The code in header:</p>
<pre class="lang-html prettyprint-override"><code><script
async custom-element="amp-script"
src="https://cdn.ampproject.org/v0/amp-script-0.1.js"
></script>
</code></pre>
<p>The .js file:</p>
<pre class="lang-js prettyprint-override"><code>function toggle_visibility(id) {
var e = document.getElementById(id);
e.style.display = ((e.style.display!='none') ? 'none' : 'block');
}
</code></pre>
<p>The amp-script wrapper:</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code><amp-script src="https://japan-translators.saeculii.com/technical/commonFiles/javascript/toggle.js">
<dd>
<a onclick="toggle_visibility('FAQ1');" class="content_link" title="For how long is a Japanese police certificate valid?"><img src="#images_href#arrow_black.gif" width="10" height="10" border="0" title="CLICK TO TOGGLE CONTENT" alt="How do I get an official translation?" /> For how long is a Japanese police certificate valid?</a><br />
<div id="FAQ1" style="display:none;">
<br /><br />
Typically, two years from the date of issue.
<br /><br />
<u>However</u>, this will depend on where and for what purpose you are submitting your certificate. Therefore, you should inquire directly at the organization that will be evaluating your documents.
<hr />
<br /><br />
</div>
</dd>
</amp-script></code></pre>
</div>
</div>
</p>
<p>Any help would be much appreciated! Thanks in advance.</p>
 

Latest posts

J
Replies
0
Views
1
Jeff P Chacko
J
Top