Kalian Member Baru, Yuk Perkenalan Dahulu. 1 Member 1 Thread.
Selamat datang di Forum Atlanta~Halo, kalian masih menjadi tamu ya di forum ini ? Kenapa masih jadi tamu ayok ikutan kita gabung di forum ini.
Banyak loh tutorial yang dapat kamu dapatkan di sini, kalian juga bisa tanya-tanya tentang masalah blog/forum kok di sini.
Langsung aja yok daftar kalau kalian belum daftar di sini Register, Kalau sudah punya IDnya langsung aja ya Login

You are not connected. Please login or register

 

Solved: [CSS] Hot Icon

Oops! Sepertinya ada sedikit kesalahan ...

[#22124]

Atlanta telah memblok tamu untuk melihat konten yang ada, silahkan mendaftar untuk dapat melihat isi konten kami.


Need Help?

Message (Halaman 1 dari 1)

#1
 on 29/10/2013, 01:12

Level 1

Level 1
Hi tommycoo! i just want to ask, how to make a hot icon just like this
[You must be registered and logged in to see this image.]

#2
 on 29/10/2013, 20:09

Owner of Atlanta


Owner of Atlanta
[You must be registered and logged in to see this link.] wrote:Hi tommycoo! i just want to ask, how to make a hot icon just like this
[You must be registered and logged in to see this image.]
Sure i'll share the tutorial if i've understand it Wink
just give me a time Senang

#3
 on 30/10/2013, 01:46

Level 1

Level 1
Ok thanks, i will wait for the codes. by the way, how am i going to do this just like your profile details
[You must be registered and logged in to see this image.]

#4
 on 30/10/2013, 12:21

Owner of Atlanta


Owner of Atlanta
Oke here is the tutorial, first you need go to Topic list box template, then find this code

Code:
<td class="tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.REPLIES}</td>
         <td class="tc3 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.VIEWS}</td>
         
and replace with this,

Code:
<td style="border:none;"  id="postA" class="tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->"><span class="ipsBadge ipsBadge_orange" data-id="hot_topic" style="display:none;">HOT</span><strong data-id="replies" class="RP">{topics_list_box.row.REPLIES}</strong> Replies<br /><strong class="VW"> {topics_list_box.row.VIEWS}</strong> Views</td>
         
after finish then put code below to very bottom of that template

Code:
<script type="text/javascript">
        //<![CDATA[
    /***
    * Copyright (c) 2013 JScript <jscriptbrasil at live.com>
    * This work is free. You can redistribute it and/or modify it
    * under the terms of the WTFPL, Version 2
    *
    * For more information, go to the home page:
    * http://punbb.forumeiros.com/forum
    */
        var replies_value = 9;
        var target = $('td.tc2');
     
        target.each(function(index){
            var oThis = $(this);
            var replies = oThis.children('strong[data-id="replies"]').text();

            if (replies > replies_value) {
                oThis.children('span[data-id="hot_topic"]').show();
            }
        });
        //]]>
    </script>
<style>
.ipsBadge {
    border-radius: 4px 4px 4px 4px;
    color: rgb(255, 255, 255);
    display: inline-block;
    font-size: 9px;
    font-weight: 700;
    height: 15px;
    line-height: 15px;
    padding: 0px 5px;
    text-transform: uppercase;
    vertical-align: middle;
    margin-right: 10px;
}
    .ipsBadge_orange {
      background: none repeat scroll 0 0 #ED7710;
    }
</style>
Copyright (c) 2013 JScript <jscriptbrasil at live.com>

#5
 on 30/10/2013, 14:19

Level 1

Level 1
Ill try it later when im on my pc.

P.S you already have the hot icon installed any chance to give a tutorial? Senyum


EDIT : not working
[You must be registered and logged in to see this image.]

#6
 on 31/10/2013, 07:25

Owner of Atlanta


Owner of Atlanta
can u give your forumlink ?

#7
 on 31/10/2013, 13:36

Level 1

Level 1
[You must be registered and logged in to see this link.]

#8
 on 31/10/2013, 22:53

Owner of Atlanta


Owner of Atlanta
did you have edited the template ?

#9
 on 31/10/2013, 23:00

Level 1

Level 1
yes, almost everything

i got it here

[You must be registered and logged in to see this link.]

#10
 on 31/10/2013, 23:07

Owner of Atlanta


Owner of Atlanta
no i mean this [You must be registered and logged in to see this link.] ?

#11
 on 1/11/2013, 00:08

Level 1

Level 1
Yes i edit the template but nothings happened

#12
 on 1/11/2013, 08:42

Owner of Atlanta


Owner of Atlanta
[You must be registered and logged in to see this link.] wrote:Yes i edit the template but nothings happened
lol!: you still don't edited, here use this template

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"><span class="filterb">Announcement and Sticky ({topics_list_box.row.COUNT_TOTAL_TOPICS})</span></h1>
   </div>
   <div class="main-content">
   <table cellspacing="0" class="table">
      <thead>
         <tr>
            <th class="tcl">{L_TOPICS}</th>
            <th class="tc2">&nbsp;</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 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><span class="filterb">Topics ({topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS})</span></h1>
   </div>
   <div class="main-content">
   <table cellspacing="0" class="table">
      <thead>
         <tr>
            <th class="tcl">{L_TOPICS}</th>
            <th class="tc2">&nbsp;</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>
            <!-- 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 -->
                          <span style="margin-left: -13px;">{topics_list_box.row.TOPIC_TYPE}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <span style="margin-left: -7px;"><h2 class="topic-title" style="font-weight: normal !important; margin-left: -13px;"><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;
                                  <br/><p style="color: #a4a4a4; margin-left: -13px;">Started {topics_list_box.row.L_BY} <span class="authooor">{topics_list_box.row.TOPIC_AUTHOR}</span></p></span>
            <!-- BEGIN switch_description -->
            <br />
            &nbsp;{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
            <!-- END switch_description -->
         </td>
                        <td style="border:none;"  id="postA" class="tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->"><span class="ipsBadge ipsBadge_orange" data-id="hot_topic" style="display:none;">HOT</span><strong data-id="replies" class="RP">{topics_list_box.row.REPLIES}</strong> Replies<br /><strong class="VW"> {topics_list_box.row.VIEWS}</strong> Views</td>
               
                  <td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->"><p style="margin-top: 8px;">{topics_list_box.row.LAST_POST_AUTHOR}<br/>{topics_list_box.row.LAST_POST_TIME}</p></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="options" style="font-size: 12px;">
         <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 -->
         
<style>
.pun-crumbs p {
display: none;
}
#onlinelist {
display: none;
}
#stats {
background-color: white !important;
}
</style>
        <script type="text/javascript">
                <a href="http://<![CDATA[" target="_blank" rel="nofollow">http://<![CDATA[</a>
            /***
            * Copyright (c) 2013 JScript <jscriptbrasil at live.com>
            * This work is free. You can redistribute it and/or modify it
            * under the terms of the WTFPL, Version 2
            *
            * For more information, go to the home page:
            * http://punbb.forumeiros.com/forum
            */
                var replies_value = 9;
                var target = $('td.tc2');
             
                target.each(function(index){
                    var oThis = $(this);
                    var replies = oThis.children('strong[data-id="replies"]').text();
                    if (replies > replies_value) {
                        oThis.children('span[data-id="hot_topic"]').show();
                    }
                });
                <a href="http://]]>" target="_blank" rel="nofollow">http://]]></a>
            </script>
        <style>
        .ipsBadge {
            border-radius: 4px 4px 4px 4px;
            color: rgb(255, 255, 255);
            display: inline-block;
            font-size: 9px;
            font-weight: 700;
            height: 15px;
            line-height: 15px;
            padding: 0px 5px;
            text-transform: uppercase;
            vertical-align: middle;
            margin-right: 10px;
        }
            .ipsBadge_orange {
              background: none repeat scroll 0 0 #ED7710;
            }
        </style>

#13
 on 2/11/2013, 13:02

Level 1

Level 1
not working. i already added the codes you gave [You must be registered and logged in to see this image.]

#14
 on 2/11/2013, 18:12

Owner of Atlanta


Owner of Atlanta
try to deleted you javascript one by one and see if this is works Senyum

#15
 on 8/11/2013, 20:25

Level 5

Level 5
Yang Versi Bahasa Indonesia Nya Dong Gan Tommyco Wink

#16
 on 8/11/2013, 21:54

Owner of Atlanta


Owner of Atlanta
nanti ane buat di tutorial setelah beberapa percobaan, tungguin aja Wink

#17
 on 9/11/2013, 08:54

Level 5

Level 5
[You must be registered and logged in to see this link.] wrote:nanti ane buat di tutorial setelah beberapa percobaan, tungguin aja Wink
Oke Gan Tommy Gua Tunggu Tutorial Nya Senyum

#18
 on 9/11/2013, 09:09

Owner of Atlanta


Owner of Atlanta
is this solved now ?

#19
 on 9/11/2013, 09:15

Level 5

Level 5
Solved Aja Gan Tommy :v

#20
 on 9/11/2013, 09:34

Owner of Atlanta


Owner of Atlanta
Lagi nunggu yang punya thread dulu Wink

#21
 on 9/11/2013, 09:37

Level 5

Level 5
Yang Versi Indonesia Mna Gan Tommyco Kok Lama Bangat ? :3

#22
 on 9/11/2013, 12:25

Retired Staff


Retired Staff
@^

Cek ini [You must be registered and logged in to see this link.]

#23
 on 9/11/2013, 12:47

Level 5

Level 5
[You must be registered and logged in to see this link.] wrote:@^

Cek ini [You must be registered and logged in to see this link.]
oke2 gua cek pak Wink

#24
 on 17/11/2013, 23:00

Level 1

Level 1
i tried everything but i cant make it really work.

#25
 on 16/12/2013, 05:53

Owner of Atlanta


Owner of Atlanta
This code is work,and i've test it on every forum so this thread will be marks as solved Wink

Sponsored content
#26
 Today at 00:36


Message (Halaman 1 dari 1)

Share This Topic !

URL :
BBcode :
HTML :

Permissions in this forum:
Anda tidak dapat menjawab topik

Total Posts Total Threads Total Members Newest Member29 November 2014 Date of Establishment of the Forum

Total 0 user online :: 0 Terdaftar, 0 Tersembunyi dan 0 Tamu

Total 0 user online :: 0 Terdaftar, 0 Tersembunyi dan 0 Tamu (Lihat list online)


User yang sedang berada di forum ini: Tidak ada