TEAM HTML5 (LIVE)-HTML5, CSS, and jQuery javascript DATA JSON.data

live_team.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>TEAM LIVE html iframe plugin VRAPro Admin</title>
        <link rel="stylesheet" href="live_team.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script type="text/javascript" src="radio.js"></script>
        <script src="live_team.js"></script>
    </head>
    <body>
        <div id="profilev"></div>
        <div id="team"></div>
    </body>
</html>

live_team.js

$(document).ready(function(){myTeam();});
function myTeam(){
$.getJSON("https://admin.vrapro.hu/json/string/json.php?radio="+radio+"&plugin=musorvezetok", function(json) {
//////////////////* start hiba oldalak *//////////////
if (401==json[0].json_status) {
$("#team").append("Plugin hiba");
 }else{if (404==json[0].json_status){
$("#team").append("Nem tudtunk kapcsolodni a rádió adminhoz.");
 }else{if (403==json[0].json_status){
$("#team").append("Lejárt rádió admin.");
 }else{if (402==json[0].json_status){
$("#team").append("Az admin fel van függesztve.");
 }else{
//////////////////* start lista *//////////////
var output ="<div class='team_live_h'>";
//////////////////* start ha nincs musorvezeto *//////////////
if (0==json[0].status) {output +="Nincsenek aktív műsorvezetők";}
//////////////////* end ha nincs musorvezeto *//////////////
var i;
for (i = 1; i <= json[0].status; i++) {
output +="<div class='team_live'>";
output +="<a style=\"cursor: pointer;\" onclick=\"myProfilec('profile','"+json[0].dj_name[i]+"','"+json[0].dj_valosnev[i]+"','"+json[0].dj_lakhely[i]+"','"+json[0].dj_szuletes[i]+"','"+json[0].dj_skype[i]+"','"+json[0].dj_facebook[i]+"','"+json[0].dj_twitter[i]+"','"+json[0].dj_bio[i]+"')\">";
output +="<img src='"+json[0].dj_img[i]+"' alt='"+json[0].dj_name[i]+"'/></a>";
output +="<div class='team_live_desc'><a style=\"cursor: pointer;\" onclick=\"myProfilec('profile','"+json[0].dj_name[i]+"','"+json[0].dj_valosnev[i]+"','"+json[0].dj_lakhely[i]+"','"+json[0].dj_szuletes[i]+"','"+json[0].dj_skype[i]+"','"+json[0].dj_facebook[i]+"','"+json[0].dj_twitter[i]+"','"+json[0].dj_bio[i]+"')\">"+json[0].dj_name[i]+"</a></div></div>";
}
output +="</div>";
$("#team").html(output);
//////////////////* end lista *//////////////
}}}}
//////////////////* end hiba oldalak *//////////////
});
}
//////////////////* start profil modal *//////////////
function myProfilec(profile,dj_name,dj_valosnev,dj_lakhely,dj_szuletes,dj_skype,dj_facebook,dj_twitter,dj_bio) {
var output ="<div class='team_live_modal' id='team_live_modal'>";
output +="<div class='team_live_modal_content'><span class='team_live_modal_close' onclick='team_live_modal_close()'>&times;</span>";
output +="<h2>"+dj_name+"</h2>";
output +="<p>Polgári nevén:"+dj_valosnev+"<br>";
output +="Lakhely:"+dj_lakhely+"<br>";
output +="Születésnap"+dj_szuletes+"<br>";
output +="Skype:"+dj_skype+"<br>";
output +="Facebook:"+dj_facebook+"<br>";
output +="Twitter:"+dj_twitter+"<br>";
output +="Biográfia:"+dj_bio+"<br></p>";
output +="</div>";
$("#profilev").html(output);
}
output +="</div>";
function team_live_modal_close() {
$('.team_live_modal').hide();
}
//////////////////* end profil modal *//////////////

live_team.css

.team_live_h {
    overflow-y: hidden;
    margin: 5px auto 5px;
    width: 100%;
}
.team_live {
    margin: 5px 5px 5px 5px;
    border: 3px solid #FF3AA0;
    float: left;
    width: 22.559%;
    height: 200px;
    background:#440C58;
    border-top-left-radius: 4%;
    border-top-right-radius: 4%;
    border-bottom-left-radius: 4%;
    border-bottom-right-radius:4%;
}
.team_live img {
    width: 100%;
    height: auto;
    border-top-left-radius: 10%;
    border-top-right-radius: 10%;
    border-bottom-left-radius: 10%;
    border-bottom-right-radius: 10%;
    box-sizing: border-box;
    border: 5px solid #B6DF89;
}
.team_live_desc {
    padding: 15px;
    text-align: center;
    font-size: 16px;
    font-family: Arial,Helvetica,sans-serif;
}
.team_live_desc a {color:#6AF3DA; text-decoration: none; cursor: pointer;}
.team_live_desc a:hover{color: #BE3AAE;}
/* START modal */
.team_live_modal {
    position: fixed;
    z-index: 1;
    left: 0;
    top: -100px;
    width: 100%;
    height: 100%;
}
.team_live_modal_content {
    font-family: 16;
    background-color: #EEF3E3;
    margin: 15% auto;
    padding: 20px;
    width: 60%;
    border: 2px solid #7335FF;
    border: 2px solid #7335FF;
    border-radius: 6px;
}
.team_live_modal_close {
    color: #BE5312;
    float: right;
    font-weight: bold;
    font-size: 20px;
}
.team_live_modal h2 {
    font-size: 1.5em;
    padding:0;
    font-weight: bold;
    color: #BE5312;
    font-family: 16;
}
.team_live_modal p {
    padding:10px 10px;
    line-height: 1em;
    color:#14131D;
    font-size: 16px;
}
.team_live_modal .team_live_modal_close:hover,
.team_live_modal .team_live_modal_close:focus {
    color: #BE3AAE;
    text-decoration: none;
    cursor: pointer;
}

Tömörített állomány létöltése (.zip)

Hozzászolások

Ehhez a plugonhoz, még nem érkeztek hozzászólások.


Új hozzászóláshoz be kel jelentkezni. Bejelentkezés | Regisztráció