занятые внешности [готово]

Код:

<!--HTML--><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script type="text/javascript" src="https://forumstatic.ru/files/0018/26/71/39091.js"></script>


<script>

$(document).ready(function() {
    $('input[type=radio][name=radio]').change(function() {
        if (this.value == 'face_all') {
            $(".female").show();
            $(".male").show();


        }
        else if (this.value == 'face_women') {
            $(".male").hide();
            $(".female").show();

        }
        else if(this.value =='face_men') {
             $(".male").show();
            $(".female").hide();


        }
        else if(this.value =='face_free') {
             $(".male").hide();
            $(".female").hide();
            $(".face_free").show();

        }
        else if(this.value =='face_double') {
             $(".male").hide();
            $(".female").hide();
            $(".face_free").hide();
            $(".double").show();

        }
    });
});
</script>


<style>
    @import url('https://fonts.googleapis.com/css?family=Arsenal|Oswald|Roboto+Condensed');
  <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
/* A1.1 */
  @import url(style_cs.css);
/
@font-face {
  font-family: "Myriad Pro";
  src: url("https://forumstatic.ru/files/000f/27/cb/37293.woff") format("woff"); 
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Helvetica";
  src: url("https://forumstatic.ru/files/000f/27/cb/40973.woff") format("woff"); 
  font-weight: normal;
  font-style: normal;
}

.distheme {
width: 600px;
min-height: 160px;
background: url(https://forumstatic.ru/files/000f/27/cb/86917.png) top no-repeat, url(https://forumstatic.ru/files/000f/27/cb/24908.png) bottom no-repeat, url(https://forumstatic.ru/files/000f/27/cb/87304.png) repeat-y;
position:relative;
}
.disthemetitle { position:absolute; top:23px; left: 30px; font-size: 24px; font-family: Helvetica, Roboto Condensed; color: #f9f9f9; text-shadow: 1px 1px #dac6f6; text-transform: uppercase; width:550px;}

.disthemetext { position:absolute; top:55px; left: 15px; padding:10px; width:550px; text-align: justify; font-size: 11px; font-family: Myriad Pro, Arial; color: #8180a8; text-shadow: 1px 1px #ebeaff;}
@import "http://fonts.fontstorage.com/import/bebasneue.css";
    .char_name {
        font-size:8px;
        text-align:right;
        width:233px;
        letter-spacing: 1px;
                text-transform:uppercase;
        font-family: 'Oswald',sans-serif;
            border-bottom: 1px solid #000;
        border-bottom-color: #a39efe;
color:#6e6aab
        
        font-weight:500;
        text-shadow: 1px 1px 5px #e5e4ff;
    }
    .male {
        
        width:233px;
        line-height: 11px;
        margin-bottom: 10px;
    }
    .female {
        
        width:233px;
        line-height: 11px;
        margin-bottom: 10px;
    }
    .celeb_name {
        font-size: 14px;
        font-weight: 300;
position:relative;
        text-transform:uppercase;
        font-family: 'Oswald', sans-serif;
        text-align: left;
        color:#66639acf;
        font-weight: 500;
    }

    
.container {

 display: inline-block;
  position: relative;
  padding: 0px 10px 0px 15px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 10px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
        
/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 10px;
  width: 10px;
  background-color: #eee;
  border-radius: 0px;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #d8b4f2;
border-radius: 0px;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
  top: 3px;
  left: 3px;
  width: 1px;
  height: 1px;
  background: transparent;
}
.if_double {
display: inline-block; position: absolute;
   top: -4px;
    padding-left: 3px;
}

</style>
<center><div class="distheme">
<div class="disthemetitle">Занятые внешности</div>
<div class="disthemetext">Чтобы на просторах youtube не появилось твоих двойников, сразу же заяви всем, что твое лицо принадлежит только тебе, и плагиату места не найдется. Заполняй шаблон, который ты найдешь ниже, и за сохранность своего образа больше беспокоиться не придется. Если же ты не против схожего контента, то можешь написать об этом, отмечаясь тут. Для того, чтобы не потеряться в списке, используй кнопки ctrl & f.</div><br><br>
    <div style="position:relative;top:110px; left:30px; padding:5px;text-align:left; font-family:sans-serif; font-size:10px; display: inline-block;"> 
        
<label class="container"><input type="radio" checked="checked" name="radio" id="face_all" value="face_all"><span class="checkmark"></span>
показать всех</label>
        
<label class="container"><input type="radio" name="radio" id="face_women" value="face_women"><span class="checkmark"></span> женщины</label>
        
 <label class="container"><input type="radio" name="radio" id="face_men" value="face_men"><span class="checkmark"></span> мужчины</label>
<label class="container"><input type="radio" name="radio" id="face_double" value="face_double"><span class="checkmark"></span> дубль разрешен</label>
<label class="container"><input type="radio" name="radio" id="face_free" value="face_free"><span class="checkmark"></span> на освобождение</label>
</div>
    <div style="position:relative; padding:10px; top:110px;height:500px; width:540px; display:block; ">

    <div style='float:left; width:260px; height:400px; overflow-y:auto;padding:5px;'>
        
  <div class="male double">
      <div class="celeb_name">
           AARON-TAYLOR JOHNSON</div>
      <div class="char_name">Christian Waterford</div>
        </div>
<div class="female">
      <div class="celeb_name">
          Amber Heard </div>
      <div class="char_name">Name Fname</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Blake Lively </div>
      <div class="char_name">Name Fname</div>
        </div>
     <div class="female face_free">
      <div class="celeb_name">
           Kendall Jenner </div>
      <div class="char_name">True Tommy</div>
        </div>
    </div>
    
       <div style='float:right; width:260px; height:400px; overflow-y:auto;padding:5px;'>
          
  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>

          <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>  <div class="male">
      <div class="celeb_name"> 
           MICHAEL FASSBENDER </div>
      <div class="char_name">Kennedy Waterford</div>
        </div>
      <div class="female">
      <div class="celeb_name">
           Rachel McAdams </div>
      <div class="char_name">Donna Waterford</div>
        </div>
    </div></div>
       <br><br>   <br><br>
</div>
</center>

девушки

Код:

<div class="female">
      <div class="celeb_name">
           внешность </div>
      <div class="char_name">имя персонажа</div>
        </div>

девушки, если не против дубля

Код:

<div class="female double">
      <div class="celeb_name">
           внешность </div>
      <div class="char_name">имя персонажа</div>
        </div>

парни

Код:

<div class="male">
      <div class="celeb_name">
           внешность </div>
      <div class="char_name">имя персонажа</div>
        </div>

парни, если не против дубля

Код:

<div class="male double">
      <div class="celeb_name">
           внешность </div>
      <div class="char_name">имя персонажа</div>
        </div>

NEHAVIEL ART FORUM

Меню навигации

Пользовательские ссылки

Информация о пользователе

занятые внешности [готово]

Сообщений 1 страница 1 из 1

Поделиться12018-06-03 20:52:42