451 Topic by nakome

(0 replies, posted in Snippets)

Here's another snippet that I like, work with related-tweets.js already included.
Adapt it as you like.
Plugin page:http://www.moretechtips.net/2009/09/rea … other.html

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> // if you do not have
<script src="http://realtime-related-tweets-bar.googlecode.com/files/jquery.relatedtweets-1.0.min.js" type="text/javascript"></script>
<style>.rrt-inner ul{list-style:none;}</style>
<div class="related-tweets" options="{
   debug:true
   ,from_users:'name user  ,other user' 
   ,links_only:1
   ,animate:'fontSize' // possible values are 'opacity', 'height', 'width', 'fontSize', 'lineHeight'. (case-sensitive)
   ,enter_time:500
    ,show_avatar : 1 // Show avatar image when set to 1 or not if set to 0
}">loading tweets ..</div>

Example : http://nakome.16mb.com/

Go to forum: Snippets

452 Reply by nakome

(4 replies, posted in Snippets)

Sorry http://nakome.16mb.com/

Go to forum: Snippets

453 Topic by nakome

(4 replies, posted in Snippets)

Hello everyone I love this cms and will try to help as you can.
First of all sorry for my English I'm learning.
This is my first contribution I hope will be useful is a snippet that converts images into links style, also add the Ligthbox extracted from the cms.
A template was tested in the bootstrap, in the other there will have to edit the css
More tomorrow.

<style>
#lightbox {
    position: fixed;
    top: 60px;
    left: 0;
    width: 100%;
    height: 100%;
    background: #444;
    text-align: center;
    z-index: 10000;
    cursor:pointer;
}
#lightbox p {
    text-align: center;
    color: #DDD;
    margin-right: 20px;    
    font-size: 14px;    
    background: #333;
    width: 100%;
}
#lightbox img {
    box-shadow:0 0 25px #111;
    -webkit-box-shadow:0 0 25px #111;
    -moz-box-shadow:0 0 25px #111;
    max-width:940px;
}
.drop-shadow {
    position:relative;
    float:left;
    width:40%;
    padding:1em;
    margin:2em 10px 4em;
    background:#fff;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.drop-shadow:before, .drop-shadow:after {
    content:"";
    position:absolute;
    z-index:-2;
}
.drop-shadow p {
    font-size:16px;
    font-weight:bold;
}
.lifted {
    -moz-border-radius:4px;
    border-radius:4px;
}
.lifted:before, .lifted:after {
    bottom:15px;
    left:10px;
    width:50%;
    height:20%;
    max-width:300px;
    -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
    -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
    -webkit-transform:rotate(-3deg);
    -moz-transform:rotate(-3deg);
    -ms-transform:rotate(-3deg);
    -o-transform:rotate(-3deg);
    transform:rotate(-3deg);
}
.lifted:after {
    right:10px;
    left:auto;
    -webkit-transform:rotate(3deg);
    -moz-transform:rotate(3deg);
    -ms-transform:rotate(3deg);
    -o-transform:rotate(3deg);
    transform:rotate(3deg);
}
</style>
<script>      
    $('img').wrap('<a class="drop-shadow lifted lightbox_trigger" href="#" title="" target="_blanck"></a>');
    $('img').each(function(n){      
        $(this).parent().addClass('fancybox img-' + n );     
    });           
    $('a img').each(function(){ 
        var img = $(this); 
        var a = img.parent(); 
        a.attr({href:img.attr('src'),title:img.attr('title')})    ; 
    }); 
jQuery(document).ready(function(a){
      a(".lightbox_trigger").click(function(b){
    b.preventDefault();var c=a(this).attr("href");
    if(
    a("#lightbox").length>0){
    a("#content").html('<img src="'+c+'" />');
    a("#lightbox").show()}
   else{
    var d='<div id="lightbox">'+"<p>Click to close</p>"+'<div id="content">'+'<img src="'+c+'" />'+"</div>"+"</div>";
    a("body").append(d)}});
    a("#lightbox").live("click",function(){
    a("#lightbox").hide()})})
</script>
<div class="clearfix"></div>

Go to forum: Snippets