JavaScript issue Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
4 posters

    JavaScript issue

    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved JavaScript issue

    Post by udarsha45 November 20th 2017, 9:25 am

    I tried to add this code, which is located on this site; http://www.punbb.biz/t331-javascript-ipb-sticky-announce-global-announce-style

    Code:
    $(document).ready(function(){$('.tcl strong:contains("Global announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF4000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
    $(document).ready(function(){$('.tcl strong:contains("Sticky")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
    $(document).ready(function(){$('.tcl strong:contains("Announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});

    However the desired results are not appearing for some reason.

    Anyone know how to make it work?

    My topics_list_box:

    Code:
    <!-- BEGIN topics_list_box -->
    <!-- BEGIN row -->
    <!-- BEGIN header_table -->
       <!-- BEGIN multi_selection -->
          <script type="text/javascript">
          function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
             var all_checked = true;
             for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
             if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
             }
             }
             document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
          }
          function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
             for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
             if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
             }
             }
          }
          </script>
       <!-- END multi_selection -->

       <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
       </div>
       <div class="main-content">
    <div class="ipb-content">
       <table cellspacing="0" class="table">
          <thead>
             <tr>
                <th class="tcl">{L_TOPICS}</th>
                              <th class="tc2"></th>
                <th class="tcr">{topics_list_box.row.L_LASTPOST}</th>
             </tr>
          </thead>
          <tbody class="statused">
    <!-- END header_table -->

    <!-- BEGIN header_row -->
    <strong>{topics_list_box.row.L_TITLE}</strong>
    <!-- END header_row -->

    <!-- BEGIN topic -->
       <!-- BEGIN table_sticky -->
          </tbody>
       </table>
                </div>
       </div>

       <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /   >
          <!-- END multi_selection -->
          <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
             
              </div>
           
       <div class="main-content">
              <div class="ipb-content">
       <table cellspacing="0" class="table">
          <thead>
             <tr>
                <th class="tcl">{L_TOPICS}</th>
                              <th class="tc2"></th>
                <th class="tcr">{topics_list_box.row.topic.table_sticky.L_LASTPOST}</th>
             </tr>
          </thead>
          <tbody class="statused">
       <!-- END table_sticky -->
          <tr>
             <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                <span class="status">
                   <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                </span>
    <div class="t2">

      <div id="mesocono" style="display: inline;">{topics_list_box.row.ICON}&nbsp;</div><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>{topics_list_box.row.GOTO_PAGE_NEW}

    </div>
    <div class="by smalltext">

        Started By {topics_list_box.row.TOPIC_AUTHOR}
    </div>
                <!-- BEGIN switch_description -->
                <br />
                &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                <!-- END switch_description -->
             </td>
                      <td class="tch3xd tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                            <ul>
             <li>
                
                   {topics_list_box.row.REPLIES} replies

             </li>
             <li class="views desc">{topics_list_box.row.VIEWS} views</li>
          </ul>
                     
                      </td>

       
             <td class="tcr hellyeah <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                      <div>
      <!-- BEGIN avatar -->
                    <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                    <!-- END avatar -->
      <span class="nothein">{topics_list_box.row.LAST_POST_AUTHOR}</span>

    </div>
    <div>

        {topics_list_box.row.LAST_POST_TIME}

    </div>
    <div>

    </div>
                      </td>
             <!-- BEGIN multi_selection -->
             <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
             <!-- END multi_selection -->
          </tr>
    <!-- END topic -->
    <!-- BEGIN no_topics -->
    <tr>
       <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
    </tr>
    <!-- END no_topics -->

    <!-- BEGIN bottom -->
          </tbody>
       </table>
              </div>
       </div>
       <div class="main-foot clearfix">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
          <p class="options">
             <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
          </p>
       </div>
    <!-- END bottom -->
    <!-- BEGIN spacer --><br /><!-- END spacer -->
    <!-- END row -->
    <!-- END topics_list_box -->


    Last edited by udarsha45 on November 22nd 2017, 2:43 pm; edited 2 times in total
    skouliki
    skouliki
    Manager
    Manager


    Female Posts : 15391
    Reputation : 1709
    Language : English,Greek
    Location : Greece

    Solved Re: JavaScript issue

    Post by skouliki November 20th 2017, 9:51 am

    hello 


    maybe because all the images url's in the code you provided are broken

    example https://i.servimg.com/u/f57/17/68/86/50/stk1010.png

    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 3:16 pm

    Hello,
    Have you changed the texts of Global Announcement, Announcement, Sticky on your ACP?

    Try to place this javascript "In subforums" position.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 3:57 pm

    @Van-Helsing

    No, I haven't.

    Still not working, tbh.
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 4:05 pm

    Hi,
    Please go to ACP(Admin Control Panel) > General > Messages and e-mails > Configuration > Messages > Separate announcements and stickies from the messages :

    and select table then press submit.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 4:14 pm

    @Van-Helsing that option was already selected, tbh. And it's still not working.
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 4:27 pm

    Can you please activate my account to check it?
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 4:35 pm

    @Van-Helsing activated your account brotha
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 4:46 pm

    Thank you,

    @udarsha45 try to replace your javascript with the below javascript:

    Code:
            $(document).ready(function(){$('.t2 strong:contains("Global announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF4000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
            $(document).ready(function(){$('.t2 strong:contains("Sticky")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
            $(document).ready(function(){$('.t2 strong:contains("Announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});

    Your topic_list_box template contains some extra HTML elements and I have been adapted the above code to fit on it. Wink
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 5:16 pm

    @Van-Helsing still not working...
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 5:21 pm

    Very strange @udarsha45 scratch can you check the texts when you try to create a topic if are they equal with javascript's texts? Note that Caps are different characters than lowercase characters in javascript.

    As a second step try to replace the texts in ACP by copying them from javascript for announcements, global announcements and stickies.

    As third step try the below code:

    Code:
                    $(document).ready(function(){$('td.tcl.tdtopics .t2 strong:contains("Global announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF4000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
                    $(document).ready(function(){$('td.tcl.tdtopics .t2 strong:contains("Sticky")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
                    $(document).ready(function(){$('td.tcl.tdtopics .t2 strong:contains("Announcement")').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 5:43 pm

    @Van-Helsing

    1. They are equal with the JS code.

    2. Done but not working.

    3. Added it but its still not showing.
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 6:07 pm

    @udarsha45
    Can you please give me access to ACP to check what is happening?
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 20th 2017, 8:10 pm

    @Van-Helsing just gave you access maye
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 20th 2017, 9:23 pm

    Hello @udarsha45
    I have been corrected the javascript:

    Code:
    $(document).ready(function(){$('.statused tr:contains(Global announcement)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF4000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
    $(document).ready(function(){$('.statused tr:contains(Sticky)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
    $(document).ready(function(){$('.statused tr:contains(Announcement)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});

    but there is a problem in the structure of topics_list_box, can you enforce the default templates for a short time to check if it is working with default templates?
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 21st 2017, 5:23 pm

    @Van-Helsing did it and it is working with the default template.

    Is there a way to make it work with the without the default temple enforced?

    Also, I've noticed that global announcement, sticky and announcement have the same colour placed. Would you be able to to assign different colours to each one?
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 21st 2017, 9:51 pm

    Hi @udarsha45,
    Yes, there is a small trick, Wink I was found a similar template from another IPB based skin to test it.

    Try to replace your skin's topics_list_box with the below:

    Code:
    <!-- BEGIN topics_list_box -->
    <!-- BEGIN row -->
    <!-- BEGIN header_table -->
       <!-- BEGIN multi_selection -->
          <script type="text/javascript">
          function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
             var all_checked = true;
             for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
             if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
             }
             }
             document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
          }
          function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
             for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
             if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
             }
             }
          }
          </script>
       <!-- END multi_selection -->

       <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
       </div>
       <div class="main-content">
       <table cellspacing="0" class="table">
          <tbody class="statused">
    <!-- END header_table -->

    <!-- BEGIN header_row -->
    <strong>{topics_list_box.row.L_TITLE}</strong>
    <!-- END header_row -->

    <!-- BEGIN topic -->
       <!-- BEGIN table_sticky -->
          </tbody>
       </table>
       </div>

       <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /   >
          <!-- END multi_selection -->
          <h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
       </div>
       <div class="main-content">
       <table cellspacing="0" class="table">
          <tbody class="statused">
       <!-- END table_sticky -->
             <td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                                    <span class="stats">
                   <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                </span>
                <!-- BEGIN single_selection -->
                <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />&nbsp;
                <!-- END single_selection -->
                {topics_list_box.row.ICON}&nbsp;
                {topics_list_box.row.NEWEST_POST_IMG}
                {topics_list_box.row.PARTICIPATE_POST_IMG}&nbsp;
                {topics_list_box.row.TOPIC_TYPE}&nbsp;
                <h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>&nbsp;
                {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}&nbsp;
                     {topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}, {topics_list_box.row.FIRST_POST_TIME}
                <!-- BEGIN switch_description -->
                <br />
                &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
                <!-- END switch_description -->
             </td>
                      <td class="tc2"></td>
                      <td class="tc3 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.REPLIES} Replies<br />{topics_list_box.row.VIEWS} Views</td>
                      <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR}<br />{topics_list_box.row.LAST_POST_TIME} {topics_list_box.row.LAST_POST_IMG}</td>
             <!-- BEGIN multi_selection -->
             <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
             <!-- END multi_selection -->
          </tr>
    <!-- END topic -->
    <!-- BEGIN no_topics -->
    <tr>
       <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
    </tr>
    <!-- END no_topics -->

    <!-- BEGIN bottom -->
          </tbody>
       </table>
       </div>
       <div class="main-foot clearfix">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
          <p class="options">
             <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;{S_WATCH_FORUM}&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>
          </p>
       </div>
    <!-- END bottom -->
    <!-- BEGIN spacer --><br /><!-- END spacer -->
    <!-- END row -->
    <!-- END topics_list_box -->

    then save and publish the template.

    Now we will fix the javascript to have three different colors, replace your javascript with the code below:

    Code:
            $(document).ready(function(){$('.statused tr:contains(Global announcement)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF0000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
            $(document).ready(function(){$('.statused tr:contains(Sticky)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #7BA60D','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});
            $(document).ready(function(){$('.statused tr:contains(Announcement)').each(function(){$(this).css({'color':'#fff','background':'url("http://i57.servimg.com/u/f57/17/68/86/50/stk1010.png") repeat-x 0 -1px #FF4000','border-radius':'3px 3px 3px 3px','display':'inline-block','font-size':'9px','font-weight':'bold','height':'16px','line-height':'16px','padding':'0 5px','text-shadow':'0 -1px 0 rgba(0, 0, 0, 0.2)','text-transform':'uppercase','vertical-align':'middle',})})});

    Then press submit.

    Now you will have the below colors for each critical topic categories:
    1. Red color (#FF0000) for Global Announcements
    2. Orange color (#FF4000) for Announcments and
    3. Green color (#7BA60D) for Stickies

    You can locate this background colors in javascript and customize them as you wish. Wink
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: JavaScript issue

    Post by udarsha45 November 22nd 2017, 9:13 am

    Thanks alot @Van-Helsing

    Your help was much appreciated.

    SOLVED.
    Van-Helsing
    Van-Helsing
    Hyperactive


    Male Posts : 2431
    Reputation : 116
    Language : English, Greek

    Solved Re: JavaScript issue

    Post by Van-Helsing November 22nd 2017, 11:52 am

    You are welcome Hello
    Draxion
    Draxion
    Helper
    Helper


    Male Posts : 2518
    Reputation : 321
    Language : English
    Location : USA

    Solved Re: JavaScript issue

    Post by Draxion November 22nd 2017, 3:45 pm

    Problem solved & topic archived.
    Please read our forum rules:  ESF General Rules