vb.org Archive
Page 24 of 26 « First 142223 24 2526
Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 4.x Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)
-   -   vBulletin Forum Sideblocks - Countdown (Forum, Sideblock, vBa CMPS, Multiple Countdowns) (https://vborg.vbsupport.ru/showthread.php?t=266689)

Bob_R 12-12-2012 03:44 PM
Here ya go!


HTML Code:
<div id="wgo" class="collapse wgo_block block">
<script language="Javascript" type="text/javascript" src="countdown/js/jquery-1.4.1.js"></script>
<script language="Javascript" type="text/javascript" src="countdown/js/jquery.lwtCountdown-1.0.js"></script>
<script language="Javascript" type="text/javascript" src="countdown/js/misc.js"></script>
        <center><h2 class="blockhead">Upcoming Events</h2></center>
        <div class="blockbody formcontrols floatcontainer">
<table align="center">
<tr>
<td>
<center>
<div><li>
    <div class="block smaller">
    <div class="widget_content blockbody floatcontainer">
        <div id="block_html_{vb:raw blockinfo.blockid}" class="blockrow">

<link rel="Stylesheet" type="text/css" href="countdown/style/main.css"></link>
<script type="text/javascript">
$(document).ready(function() {
  $('#countdown').countDown({
        targetDate: {
            'day':      25,
            'month':    12,
            'year':    2012,
            'hour':    23,
            'min':      59,
            'sec':    59
          },
// onComplete function
        onComplete: function() {
$('#complete_info_message').slideDown();
}

    });
});

</script>
<div align="center">LINK TO IMAGE</div>
<span class="digit">Countdown to Christmas</span><br/><br/></div>
       
        <div id="countdown">
            <div class="dash first weeks_dash">
                <span class="dash_title">Weeks</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash days_dash">
                <span class="dash_title">Days</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash hours_dash">
                <span class="dash_title">Hrs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash minutes_dash">
                <span class="dash_title">Mins</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash seconds_dash">
                <span class="dash_title">Secs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
<div class="info_message" id="complete_info_message" style="display: none;">
                Countdown Complete
            </div>
        </div>
</div>
</div>
        </div>
    </div>
    <div class="underblock"></div>
</li>
    </center>
</td>
<td class="blocksubhead" align="{vb:stylevar.left}" valign="top">
<center>
<div><li>
    <div class="block smaller">
        <div class="widget_content blockbody floatcontainer">
        <div id="block_html_{vb:raw blockinfo.blockid}" class="blockrow">

<link rel="Stylesheet" type="text/css" href="countdown/style/main.css"></link>
<script type="text/javascript">
$(document).ready(function() {
 $('#countdown2').countDown({
        targetDate: {
            'day':      00,
            'month':    00,
            'year':    0000,
            'hour':    00,
            'min':      00,
            'sec':    00
          },
// onComplete function
        onComplete: function() {
$('#complete_info_message2').slideDown();
}

    });
});

</script>
<div align="center">LINK TO IMAGE</div>
<span class="digit">BLURB I WANT TO DISPLAY</span><br/><br/></div>
       
        <div id="countdown2">
            <div class="dash first weeks_dash">
                <span class="dash_title">Weeks</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash days_dash">
                <span class="dash_title">Days</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash hours_dash">
                <span class="dash_title">Hrs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash minutes_dash">
                <span class="dash_title">Mins</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash seconds_dash">
                <span class="dash_title">Secs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
<div class="info_message" id="complete_info_message2" style="display: none;">
                Countdown Complete
            </div>
        </div>
</div>
</div>
        </div>
    </div>
    <div class="underblock"></div>
</li>
    </center>
</td>

<td class="blocksubhead" align="{vb:stylevar.left}" valign="top">
<center>
<div><li>
    <div class="block smaller">
        <div class="widget_content blockbody floatcontainer">
        <div id="block_html_{vb:raw blockinfo.blockid}" class="blockrow">

<link rel="Stylesheet" type="text/css" href="countdown/style/main.css"></link>
<script type="text/javascript">
$(document).ready(function() {
  $('#countdown3').countDown({
        targetDate: {
            'day':      00,
            'month':    00,
            'year':    0000,
            'hour':    00,
            'min':      00,
            'sec':    00,
          }
    });
});

</script>
<div align="center">LINK TO IMAGE</div>
<span class="digit">BLURB I WANT TO DISPLAY</span><br/><br/></div>
       
        <div id="countdown3">
            <div class="dash first weeks_dash">
                <span class="dash_title">Weeks</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash days_dash">
                <span class="dash_title">Days</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash hours_dash">
                <span class="dash_title">Hrs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash minutes_dash">
                <span class="dash_title">Mins</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash seconds_dash">
                <span class="dash_title">Secs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
        </div>
</div>
</div>
        </div>
    </div>
<div class="underblock"></div>
</li>
    </center>
</td>
<td class="blocksubhead" align="{vb:stylevar.left}" valign="top">
<center>
<div><li>
    <div class="block smaller">
        <div class="widget_content blockbody floatcontainer">
        <div id="block_html_{vb:raw blockinfo.blockid}" class="blockrow">
<link rel="Stylesheet" type="text/css" href="countdown/style/main.css"></link>
<script type="text/javascript">
$(document).ready(function() {
  $('#countdown4').countDown({
        targetDate: {
            'day':      00,
            'month':    00,
            'year':    0000,
            'hour':    00,
            'min':      00,
            'sec':    00,
          }
    });
});

</script>
<div align="center">LINK TO IMAGE</div>
<span class="digit">BLURB I WANT TO DISPLAY</span><br/><br/></div>
       
        <div id="countdown4">
            <div class="dash first weeks_dash">
                <span class="dash_title">Weeks</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash days_dash">
                <span class="dash_title">Days</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash hours_dash">
                <span class="dash_title">Hrs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash minutes_dash">
                <span class="dash_title">Mins</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
            <div class="dash seconds_dash">
                <span class="dash_title">Secs</span>
                <div class="digit">0</div>
                <div class="digit">0</div>
            </div>
        </div>
</li></center></td></tr></table></center></div>

Gemma 12-12-2012 06:15 PM
Hmmm. It displays fine on my test site so not sure where the problem lies.

edit: Just tried it on my main site too and it was fine.

MG Zebra 12-17-2012 10:30 PM
I don't really know how to use these blocks on vbulletin. Can you tell me how to put them on the site once they're created or direct me to where that information is please? Thanks.

EDIT: I figured out how to add it. Thanks.

Bob_R 12-17-2012 10:32 PM
Quote:
Originally Posted by Gemma (Post 2390189)
Added it to my site, only thing I've done different is add the css to additional.css instead of having a file on the server. And I didn't bother with this line:

Code:
<script language="Javascript" type="text/javascript" src="countdown/js/jquery-1.4.1.js"></script>
http://www.arcadejunkies.org/forum.php
What additional.css file? These are the 4 files listed on Step 1 of the instructions.

countdown/js/jquery-1.4.1.js
countdown/js/jquery.lwtCountdown-1.0.js
countdown/js/misc.js
countdown/style/main.css

Secondly, take the line of code you mentioned out? And more importantly where is it? I don't see it.

Thanks.

Gemma 12-18-2012 10:25 AM
Quote:
Originally Posted by Bob_R (Post 2391393)
What additional.css file? These are the 4 files listed on Step 1 of the instructions.

countdown/js/jquery-1.4.1.js
countdown/js/jquery.lwtCountdown-1.0.js
countdown/js/misc.js
countdown/style/main.css

Secondly, take the line of code you mentioned out? And more importantly where is it? I don't see it.

Thanks.
I took the code from the main.css file and added it into the additional.css template - AdminCP > Styles & Templates > Style Manager > Edit Templates > CSS Templates > additional.css

Code:
#countdown {
    height: 46px;
    padding: 2px 0 2px;
}
.dash {
    border-left: 1px solid #5C7099;
    float: left;
    height: 44px;
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
    width: 28px;
}
.first {
    border-left: 0 none;
    margin-left: 12px;
    padding-left: 0;
}
.dash .digit {
    color: #5C7099;
    float: left;
    font-family: Arial,sans-serif;
    font-size: 24px;
    font-weight: bold;
    position: relative;
}
.dash_title {
    bottom: 0;
    color: #5C7099;
    display: block;
    font-family: Arial,sans-serif;
    font-size: 9px;
    letter-spacing: 0;
    position: absolute;
    right: 2px;
    text-transform: uppercase;
}
After doing that I don't need the code below from the countdown block code - it may appear several times depending on how many countdowns you have appearing

Code:
<link rel="Stylesheet" type="text/css" href="countdown/style/main.css"></link>
Also, I'm already running a version of jquery so I don't need to call on it in the countdown block template either so I removed this code.

Code:
<script language="Javascript" type="text/javascript" src="countdown/js/jquery-1.4.1.js"></script>

Bob_R 12-18-2012 07:51 PM
OK, thanks.

For the life of me I can't figure out way the first countdown block is just a "smidgen" lower than the other 3.

I even tried it on a different style/skin/template and same thing.

FWIW, I used the code in post #153 not post #158

Gemma 12-18-2012 10:41 PM
Quote:
Originally Posted by Bob_R (Post 2391556)
OK, thanks.

For the life of me I can't figure out way the first countdown block is just a "smidgen" lower than the other 3.

I even tried it on a different style/skin/template and same thing.

FWIW, I used the code in post #153 not post #158
Change:
Code:
$('#countdown').countDown({
To:
Code:
$('#countdown1').countDown({
And change:
Code:
<div id="countdown">
To this:
Code:
<div id="countdown1">

Bob_R 12-18-2012 11:42 PM
Nope. :(

Bob_R 12-19-2012 04:28 PM
Gemma, I got it.

Added:

HTML Code:
<td class="blocksubhead" align="" valign="top">
Instead of:

HTML Code:
<td>
towards the top of the code.

DefiantComplex 01-28-2013 01:43 PM
I like this little addition and want to add it to my site.

However, is there a way to make this run everyday rather then a selected date without having to manually change it every day?


All times are GMT. The time now is 07:43 AM.
Page 24 of 26 « First 142223 24 2526
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01340 seconds
  • Memory Usage 1,841KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (8)bbcode_code_printable
  • (3)bbcode_html_printable
  • (3)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (4)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete