Post MY

Developer
Size
3,123 Kb
Views
44,528

How do I make an post my?

What is a post my? How do you make a post my? This script and codes were developed by Xdsnet on 26 August 2022, Friday.

Post MY Previews

Post MY - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>post MY</title> <link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="quote-box"> <div class="quote-text"> <i class="fa fa-quote-left"></i><span id="text"><!--引用文字展示位置--></span> </div> <div class="quote-author"> --<span id="author"><!--文字作者位置--></span> </div> <div class="buttons"><!--放置系列按钮--> <a class="button" id="tweet-fb" title="在Twitter发布!" target="_blank"> <i class="fa fa-twitter"></i> </a> <button class="button" id="new-quote">新引用</button> </div>
</div>
<div class="footer"> by <a href="http://codepen.io/xdsnet/">xdsnet</a></div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Post MY - Script Codes CSS Codes

*{ margin: 0; padding: 0; list-style: none; vertical-align: baseline;
}
div { position: relative; z-index: 2;
}
body { background-color: #333; color: #333; font-family: sans-serif; font-weight: 400;
}
.quote-box { border-radius: 3px; position: relative; margin: 8% auto auto auto; width: 550px; padding: 40px 50px; display: table; background-color: #fff;
}
.quote-box .quote-text { text-align: left; width: 550px; height: auto; clear: both; font-weight: 500; font-size: 1.75em;
}
.quote-box .quote-author { width: 550px; height: auto; clear: both; padding-top: 20px; font-size: 1em; text-align: right;
}
.quote-box .buttons { width: 550px; margin: auto; display: block;
}
.quote-box .buttons .button { height: 38px; border: none; border-radius: 3px; color: #fff; background-color: #333; outline: none; font-size: 0.85em; padding: 8px 18px 6px 18px; margin-top: 30px; opacity: 1; cursor: pointer;
}
.quote-box .buttons .button:hover { opacity: 0.9;
}
.quote-box .buttons .button#tweet-fb { float: left; padding: 0px; padding-top: 8px; text-align: center; font-size: 1.2em; margin-right: 5px; height: 30px; width: 40px;
}
.quote-box .buttons .button#new-quote { float: right;
}
.footer { width: 550px; text-align: center; display: block; margin: 15px auto 30px auto; font-size: 0.8em; color: #fff;
}
.footer a { font-weight: 500; text-decoration: none; color: #eee;
}

Post MY - Script Codes JS Codes

// 定义切换颜色组
var colors = ['#555555', '#33ffee', '#22ccff','#ffee11', '#349823', '#2f4c3e'];
var currentQuote = '';// 获取的引言文字
var currentAuthor = '';// 作者
function tweetURL(c,a){ return ('https://twitter.com/intent/tweet?hashtags=quotes&related=freecodecamp&text=' + encodeURIComponent('"' + c + '" ' + a));
}
function getQuote() { // 利用ajax获取引言 $.ajax({ headers: { Accept: "application/json", "Content-Type": "application/x-www-form-urlencoded" }, url: 'http://api.tianapi.com/txapi/dictum/?key=9e2835f96e3842d3a4243032a287a16e', success: function(response) { var r=response; currentQuote = r.newslist[0].content; currentAuthor = r.newslist[0].mrname; $('#tweet-fb').attr('href', tweetURL( currentQuote , currentAuthor)); $(".quote-text").animate({ //处理展示动态效果 opacity: 0 }, 500, function() { $(this).animate({ opacity: 1 }, 500); $('#text').text(currentQuote); }); $(".quote-author").animate({ //处理展示动态效果 opacity: 0 }, 500, function() { $(this).animate({ opacity: 1 }, 500); $('#author').html(currentAuthor); }); var color = Math.floor(Math.random() * colors.length); $("html body").animate({ backgroundColor: colors[color], color: colors[color] }, 1000); $(".button").animate({ backgroundColor: colors[color] }, 1000); } });
}
$(document).ready(function() { getQuote(); $('#new-quote').on('click', getQuote);
});
Post MY - Script Codes
Post MY - Script Codes
Home Page Home
Developer Xdsnet
Username xdsnet
Uploaded August 26, 2022
Rating 3
Size 3,123 Kb
Views 44,528
Do you need developer help for Post MY?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Xdsnet (xdsnet) Script Codes
Name
A Pen by xdsnet
Wikipedia Search
Your weather
Xdsnet JSQ
My short log
Create amazing Facebook ads with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!