Эксперименты Will O The Wisp

Страница: « 1 … 18 19 20 21 »

Сообщений 191 страница 200 из 203

Поделиться19102.06.24 19:40

Автор: Automation Baby
Атаманша
Последний визит:
18.08.24 17:56
Уважение: +9027

#p204539,Will O The Wisp написал(а):

Automation Baby
мне он показался интересным как пример реализации, там забавно черные квадраты повернуты поверх цветного

Меню и правда красивое... Слушай, а ты же спец по тому как скрипты откуда-то устанавливать на майбб? Можешь помочь человеку эффект дождика на форум поставить вот тут? Там есть уже код, просто он никак не может разобраться как это всё дело поставить чтобы работало... Может подскажешь?

Подпись автора

Отвечаю на вопросы вот здесь | Мой блог

"Никогда не сомневайтесь в себе и любите каждую свою работу, даже если она кажется вам грязью на окне. Через это окно люди смотрят на мир, тогда как разводы замечаете только вы." © Николай Ободников. "Лиллехейм. Волчий ветер‌‍

Поделиться19202.06.24 21:28

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

Код:

[html]
<style>
.punbb {
   margin-left: 0px !important;
}

#maimg {
background-image: url(https://i.pinimg.com/564x/c0/d2/81/c0d281799b949c7e161e4592243434b6.jpg);
background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.maapp {
  position: relative;
  background-color: #fff;
  padding: 20px;
  outline: 1px solid #eee;
  height: auto;
  width: 95%;
}

.maapp1 {
  width: 98%;
  height: 500px;
  z-index: 1;
}

.maoverlay {
  background-color: rgba(0, 0, 0, 0.3);
  width: 98%;
  height: 500px;
  position: relative;
  top: 0px;
  left: -7px;
  opacity: 1;
  text-align: justify;
  overflow: hidden;
  z-index: 2;
  -o-transition: all 0.6s ease-in-out;
  -webkit-transition: all 0.6s ease-in-out;
  -moz-transition: all 0.6s ease-in-out;
  transition-delay: .1s;
}

.maoverlay .maapp2 {
  top: 100px;
  left: 50px;
  position: absolute;
  width: 90%;
  height: 500px;
  -o-transition: all 0.6s ease-in-out;
  -webkit-transition: all 0.6s ease-in-out;
  -moz-transition: all 0.6s ease-in-out;
}

.macontainer {
  background-color: transparent;
  clear: both;
  height: 500px;
  position: absolute;
  width: 95%;
}

.macontainer label[for=maname] {
  position: absolute;
  top: 220px;
  left: 75px;
  height: 100px;
  width: 80%;
  background-color: transparent;
  color: #fff;
  z-index: 99;
  text-align: center;
  font-family: argon;
  font-size: 30px;
  letter-spacing: 0px;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition-delay: .2s;
  padding-bottom: 50px;
  padding-right: 5px;
  cursor: url(http://cur.cursors-4u.net/symbols/sym-1/sym57.cur), progress !important;
}

.macontainer input[type=checkbox]:checked ~ label[for=maname] {
  left: 220px;
  top: 480px;
  height: 25px;
  background-color: transparent;
  width: 50%;
  text-align: center;
  font-family: argon;
  font-size: 10px;
  color: #000;
  line-height: 10px;
  position: absolute;
  letter-spacing: 0px;
  padding-top: 10px;
  z-index: 5;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  opacity: 1;
}

.macontainer label[for=maname]:hover {color: #fff}
.macontainer input[type=checkbox] {display: none;}

.macontent {
  position: relative;
  height: 500px;
  width: 100%;
  left: 0px;
  top: 650px;
  background-color: #fff;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -ms-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  -webkit-transition-delay: .1s;
  overflow: hidden;
}

.macontainer input[type=checkbox]:checked ~ label[for=maname] ~ .macontent {
  left: 0px;
  top: 0px;
  opacity: 1;
  height: 500px;
  z-index: 4;
  width: 100%;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -ms-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  -webkit-transition-delay: .1s;
}

.magif {
  width: 80%;
  height: 120px;
  border-radius: 100%;
}

.magif img {
  width: ;
  height: 120px;
  padding: 5px;
  border: 1px solid #eee;
}

.manamebox {
  padding: 15px;
  border: 3px solid #fff;
}

.mapara {
  margin-top: 20px;
  width: 95%;
  height: 170px;
  padding: 10px;
  overflow-y: auto;
  background: #fff;
  text-align: justify;
  font: 1.2em calibri;
  line-height: 100%;
}
::-webkit-scrollbar {
    width: 5px;
}

.mafield1 {
  position: absolute;
  top: 8px;
  right: 10px;
  font: 14px montserrat;
  font-weight: 700;
  text-transform: lowercase;
  text-align: right;
  width: 240px;
  background: #fff;
  padding-bottom: 7px;
  border-bottom: 1px solid #eee;
}

.mafield2 {
  position: absolute;
  top: 40px;
  right: 10px;
  font: 14px montserrat;
  font-weight: 700;
  text-transform: lowercase;
  text-align: right;
  width: 240px;
  background: #fff;
  padding-bottom: 7px;
  border-bottom: 1px solid #eee;
}

.mafield3 {
  position: absolute;
  top: 70px;
  right: 10px;
  font: 14px montserrat;
  font-weight: 700;  
  text-transform: lowercase;
  text-align: right;
  width: 240px;
  background: #fff;
  padding-bottom: 7px;
  border-bottom: 1px solid #eee;
}

.mafield4 {
  position: absolute;
  top: 100px;
  right: 10px;
  font: 14px montserrat;
  font-weight: 700;
  text-transform: lowercase;
  text-align: right;
  width: 240px;
  background: #fff;
  padding-bottom: 7px;
  border-bottom: 1px solid #eee;
}

.mafa {
  color: #bbb;
  text-align: left;
  float: left;
}

.maspacer1 {
  width: 400px;
  height: 2px;
  border-bottom: 1px dashed #fff;
  background: #eee;
  margin-top: 30px;
}

.maspacer2 {
  width: 400px;
  height: 2px;
  border-bottom: 1px dashed #fff;
  background: #eee;
  margin-top: 25px;
}

.maquote {
  margin-top: 25px;
  padding: 5px;
  font: 13px montserrat;
  color: #000;
  font-weight: 700;
  line-height: 135%;
  text-align: left;
}
</style>

<center>
	<div class="maapp">
    <div class="maapp1" id="maimg">  
    	<div class="macontainer">
        <div class="maoverlay">
        	<input type="checkbox" id="maname" name="toggle">
        	<label for="maname"> <span class="manamebox">Джон Доу</span> </label>
        	<div class="macontent">
            <table>
            	<tr>
                <td>
                	<div class="magif">
                    <img src="https://i.pinimg.com/564x/61/c1/c7/61c1c7583deff501b406f708dfbb8344.jpg">
                	</div>
                </td>
                <td>
                	<div class="mafield1"><span class="mafa"><i class="fa fa-hashtag"></i></span> full name</div>
                	<div class="mafield2"><span class="mafa"><i class="fa fa-calendar"></i></span> age in letters</div>
                	<div class="mafield3"><span class="mafa"><i class="fa fa-play"></i></span>membergroup</div>
                	<div class="mafield4"><span class="mafa"><i class="fa fa-music"></i></span>occupation</div>
                </td>
            	</tr>
            	<tr>
                <td colspan="2"><div class="maspacer1"></div></td>
            	</tr>
            	<tr>
                <td>
                	<div class="mapara">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse auctor dui sit amet metus feugiat, commodo posuere leo condimentum. In tristique aliquam arcu id egestas. Nullam hendrerit massa a neque fringilla, eu efficitur felis sagittis. Duis ut quam ut felis vulputate sodales. Duis nec porttitor purus. Nunc fringilla sem velit, id pellentesque ante tempor quis. Sed facilisis ligula lacus, sit amet pharetra felis sodales nec. Nam eu dui quis orci suscipit ornare ut venenatis magna. Nunc cursus lectus nec est consequat efficitur. Nunc accumsan malesuada odio non tempus. Morbi malesuada bibendum urna, ut porta nulla consequat eget. Nulla semper sapien nec augue faucibus, ac porta urna varius. Sed interdum lobortis eros in facilisis. Nunc consequat vitae velit quis mollis. Etiam id nisl ac urna molestie lacinia sed efficitur mi. Sed ultricies sit amet mi sit amet viverra.<br>
                    Sed laoreet nibh ut dui sollicitudin, gravida tincidunt velit venenatis. Nunc ut nulla a neque malesuada mollis sed eget lacus. Etiam venenatis, arcu ut venenatis dictum, lorem est tincidunt libero, vel pharetra nibh leo vel erat. Nam sodales dictum quam quis sollicitudin. Pellentesque sodales gravida felis. Cras ut sodales ex. Quisque vitae justo et velit ultricies tincidunt. Nullam vitae est rutrum diam euismod euismod. Curabitur aliquam odio eget turpis rutrum porttitor. Donec lacus mauris, malesuada vel tellus eget, aliquet luctus tellus. In vitae fringilla lorem. Aenean laoreet consequat elit et egestas.<br>
                    Aliquam sollicitudin dui id urna tristique, ut vestibulum enim blandit. Etiam pellentesque sed est vitae malesuada. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla rhoncus, risus eget lacinia tincidunt, neque libero ornare arcu, vitae aliquet elit ligula eget leo. Morbi viverra massa et feugiat ultrices. Sed placerat dapibus tortor ut dictum. Pellentesque in sollicitudin arcu, vitae dignissim odio. Aenean sed vulputate mi. Nam iaculis sagittis felis, ut placerat sem maximus vitae. Nam porttitor nunc sit amet blandit efficitur. Integer enim dolor, elementum ac purus eget, rhoncus fringilla massa. Praesent et tortor nec ipsum porta tempus vel eu libero. Sed egestas orci enim, non auctor nunc pretium sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla efficitur maximus dolor, quis pretium dui commodo vitae.
<br>                    Etiam tortor mi, consequat sit amet nisl ac, commodo vestibulum tellus. Donec tristique lorem in lectus faucibus, eu sagittis elit posuere. Duis lobortis enim magna, quis maximus arcu fermentum et. Curabitur luctus augue nisl, nec dapibus nibh aliquet sit amet. Sed tristique, ex quis interdum ultricies, est mi suscipit mi, non facilisis nisl tellus vitae mi. Vestibulum vulputate, sapien tristique sagittis blandit, tellus nisi feugiat ipsum, quis scelerisque arcu velit suscipit metus. Aliquam pulvinar cursus enim id interdum. Maecenas auctor finibus luctus. Nullam nibh metus, cursus et nisl in, ullamcorper lacinia leo. Nunc nulla arcu, efficitur non ipsum eu, ultrices porttitor magna.
                	</div>
                </td>
            	</tr>
            	<tr>
                <td colspan="2"><div class="maspacer2"></div></td>
            	</tr>
            	<tr>
                <td>
                	<div class="maquote">ALIAS \ TIMEZONE \ CONTACT</div>
                </td>
            	</tr>
            </table>
        	</div>
        </div>
    	</div>
    </div>
	</div>
</center>


[/html]

Цитировать Сообщение 192

Поделиться19302.06.24 22:22

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

по мотивам дождя
Листья! Совершенно не листопад

Код:

<style>
#leaf-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
}

#leaf-container span {
    position: absolute;
    width: 35px;
    height: 35px;
    background: url('https://forumupload.ru/uploads/001c/1e/87/2/451018.png'); 
    background-size: cover;
    animation: fall 5s linear infinite;
}

@keyframes fall {
    0% {
        transform: translate(0, -100vh) rotate(0deg) scale(0.5);
        opacity: 0;
    }
    100% {
        transform: translate(calc(100vw * var(--random-x)), 100vh) rotate(720deg) scale(1);
        opacity: 1;
    }
}

/* Génération de valeurs aléatoires pour le déplacement horizontal */
#leaf-container span:nth-child(1) {
    --random-x: 0.1;
  animation-delay: 1s; /* Retard de 2 secondes pour la première feuille */
}

#leaf-container span:nth-child(2) {
    --random-x: 0.3;
  animation-delay: 1s;
}

#leaf-container span:nth-child(3) {
    --random-x: 0.5;
  animation-delay: 3s;
}

#leaf-container span:nth-child(4) {
    --random-x: 0.8;
  animation-delay: 4s;
}

#leaf-container span:nth-child(5) {
    --random-x: 1;
  animation-delay: 1.4s;
}

#leaf-container span:nth-child(6) {
    --random-x: 1.2;
  animation-delay: 1.2s;
}

#leaf-container span:nth-child(7) {
    --random-x: 1.5;
  animation-delay: 2.1s;
}

#leaf-container span:nth-child(8) {
    --random-x: 1.8;
  animation-delay: 2s;
}
        </style>

<div id="leaf-container">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>

Цитировать Сообщение 193

Поделиться19416.06.24 22:39

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

Код:

<script>
(function(){
	var Part = function(x,y){
    this.x = x;
    this.y = y;
    this.bx = x;
    this.by = y;
    this.ax = 0;
    this.ay = 0;
    this.r;
    this.g;
    this.b;
    this.a;
	};
	Part.prototype = {
    r : function (v) { this.r = v;return this; },
    g : function (v) { this.g = v;return this; },
    b : function (v) { this.b = v;return this; },
    a : function (v) { this.a = v;return this; },
	};
	var String = function(str){
    this.fontSize = 40;
    this.font = 'Elsie Swash Caps';
    this.str = str;
    this.strWidth;
    this.d = document;
    this.c;
    this.$;
    this.parr = [];
    this.set();
	};
	String.prototype = {
    set : function(){
    	var c = this.d.createElement('canvas');
    	var $ = c.getContext('2d');
    	$.strokeStyle = '#eae2cf00';
    	$.textBaseline = 'top';
    	$.font =  '45px Elsie Swash Caps';
    	c.width = $.measureText(this.str).width;
    	this.strWidth = c.width;
    	c.height = ~~(45 * 1.2);
    	$.strokeStyle = '#eae2cf00';
    	$.textBaseline = 'top';
    	$.font = '45px Elsie Swash Caps';
    	$.fillText(this.str,0,0);
    	this.c = c;
    	this.$ = $;
    },
    app : function(e){
    	e.appendChild(this.c);
    	this.build();
    	this.ev();
    	return this;
    },
    el : function(){
    	return this.c;
    },
    build : function(){
    	var w = this.c.width,
        h = this.c.height,
        id =  this.$.getImageData(0,0,w,h).data,
        l = id.length
    	;
    	for(var i=0;i<l;i+=4){
        var y = ~~(i / (w*4));
        var x = (i/4)%w;
        var r = id[i];
        var g = id[i+1];
        var b = id[i+2];
        var a = id[i+3];
        if (r+g+b<100 && a>50){
        	this.parr.push( (new Part(x,y)).r(r).g(g).b(b).a(a) );
        }
    	}
    },
    ev : function(){
    	var _this = this;
    	this.c.onmouseover = function(){
        var __t = setInterval(_this.func(_this,_this.anim),50);
        setTimeout(function(){
        	clearInterval(__t);
        	var cnt = 10;
        	var time = setInterval(function(){
            cnt--;
            for(var i=0,l=_this.parr.length;i<l;i++){
            	var p=_this.parr[i];
            	p.x = p.bx;
            	p.y = p.by + ((_this.fontSize-p.by) * (cnt) / 10);
            }
            _this._draw(_this.parr);
            if (cnt<=0) {
            	_this.$.clearRect(0,0,_this.c.width,_this.c.height);
            	_this.def(_this.parr);
            	_this._draw(_this.parr);
            	clearInterval(time);
            }
        	},30);
        },3000);
    	};
    },
    func : function(thisFunc,func){
    	return function(){
        func.call(thisFunc);
    	};
    },
    anim : function(){
    	this._move(this.parr);
    	this._draw(this.parr);
    },
    _draw : function(parr){
        this.$.fillStyle = '#ffff';
        this.$.fillRect(0,0,this.c.width,this.c.height);
    	for(var i=0,l=parr.length;i<l;i++){
        var p=parr[i],x=~~p.x,y=~~p.y;
        this.$.fillStyle = '#000';
        this.$.fillRect(x,y,1,1);
    	}
    },
    _move : function(parr){
    	for(var i=0,l=parr.length;i<l;i++){
        var p=parr[i];
        p.ax == 0 ? p.ax = 0.2*(Math.random()-0.5) : p.ax *= 1.1;
        p.ay == 0 ? p.ay = (Math.random()) : p.ay *= 1.1;
        p.x += p.ax;
        p.y += p.ay;
    	}
    },
    def : function(parr){
    	for(var i=0,l=parr.length;i<l;i++){
        var p=parr[i];
        p.x = p.bx;
        p.y = p.by;
        p.ax = p.ay = 0;
    	}
    }
	};
	
	setTimeout(function(){
    var loc = document.querySelectorAll('div.txt');
    var start = (new Date().getTime())/1000;
    Array.prototype.map.call(loc,function(e){
    	if ((new Date().getTime())/1000 > start+5) return;
    	var nodes = Array.prototype.slice.call(e.childNodes);
    	nodes.map(function(n){
        if ((new Date().getTime())/1000 > start+5) return;
        if (n instanceof Text){
        	var id = n.textContent || n.id;
        	var frag = document.createDocumentFragment();
        	id.split('').map(function(str){
            if(str==='' || str==='\n' || str==='\r' || str==='\t')return;
            (new String(str)).app(frag).el().style.verticalAlign = 'top';
        	});
        	e.replaceChild( frag , n );
        }
    	});
    	
    });
	},0);

})();
</script>
<section style="background: #ffff;">
 <div class="txt">Падающие буквы</div><hr><div class="txt">Возвращение букв</div>
</section>

Все меняется через скрипт - размер текста, шрифт, цвет, цвет задника

Отредактировано Will O The Wisp (16.06.24 22:39)

Цитировать Сообщение 194

Поделиться19520.06.24 11:09

Автор: Automation Baby
Атаманша
Последний визит:
18.08.24 17:56
Уважение: +9027

#p205181,Will O The Wisp написал(а):

Прикольно! Сам написал?

Подпись автора

Отвечаю на вопросы вот здесь | Мой блог

Поделиться19620.06.24 11:31

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

#p205300,Automation Baby написал(а):

Прикольно! Сам написал?

Ты обо мне слишком хорошего мнения хД

Отредактировано Will O The Wisp (20.06.24 11:31)

Цитировать Сообщение 196

Поделиться19720.06.24 11:57

Автор: Automation Baby
Атаманша
Последний визит:
18.08.24 17:56
Уважение: +9027

#p205301,Will O The Wisp написал(а):

Ты обо мне слишком хорошего мнения хД

Ну а вдруг?
Но за находку спасибо! Добавила в наш каталог

Подпись автора

Отвечаю на вопросы вот здесь | Мой блог

Поделиться19826.06.24 16:57

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

Реализуем вкладки

Код:

<style>
/*вкладки, (c) EMERAEL 2024*/
.hidden {display: none;}

.custom_tag.custom_tag_tabtitle {
    display: inline-grid;
    justify-content: center;
    cursor: pointer;
    margin: 10px 10px -12px 0px;
    font: bold 7px Open Sans;
    letter-spacing: .5px;
    line-height: 8px;
    text-transform: uppercase;
    text-align: center;
    margin-right: 2px;
    border: solid 1px #e3e3e3;
    border-bottom: none;
    border-radius: 5px 5px 0px 0px;
    padding: 9px;
    height: 8px;
    background-color: #f9f9f9;
    width: 85px;
    color:  #c9c5b9;
}

.custom_tag.custom_tag_tabtitle::-webkit-scrollbar-thumb:vertical { background-color:#eeeeee;border:solid 1px #e3e3e3;border-radius:0px; }

.custom_tag.custom_tag_tabtitle::-webkit-scrollbar { width:5px;background-color:transparent;border-radius:0px; }

.custom_tag.custom_tag_tabtitle p {padding: 0;}

.custom_tag.custom_tag_tabtitle.active {
    background: #f0f0f0;
    color: #8d8387;
    border: 1px solid var#e3e3e3;
}

.custom_tag.custom_tag_tab {
    overflow-y: auto;
    margin: 8px 0px 0px 0px;
    padding: 10px;
    border: 1px solid #e3e3e3;
}

.tabsy { 
width:95%;
padding:9px;
border:solid 1px #e3e3e3;
background-color:#f5f5f5;
color:#444444;
text-align:justify; 
}


.tabsy-img {
 border:solid 1px #e3e3e3;
background-color:#c9c5b9;
}

.tabsy-banner { 
    width: 100%;
    height: 250px;
    position: relative;
    overflow: hidden;
}
.tabsy-banner img { 
    width: 100%;
    height: 250px;
    position: absolute;
    overflow: hidden;
    z-index: 0;
}


.tabsy-banner-name { 
font:60px Montserrat;
font-weight:300!important;
letter-spacing:-1px;
position:absolute;
color:#f9f9f9;
padding-top:45px;
text-shadow:0px 0px 4px rgba(44,44,44,.35); 
    z-index: 1;
width: 100%;
}

.tabsy-quote-words {
    font: bold 10px Inconsolata;
    letter-spacing: 3px;
    text-transform: uppercase;
    padding-top:140px;
    z-index: 600;
    position: absolute;
    color: #f9f9f9;
    text-shadow: 0px 0px 4px rgba(44, 44, 44, .35);
width: 100%;
}

.tabsy-quote-words-1 {
    padding-top: 18px;
    font: 30px Montserrat;
    line-height: 25px;
    color: #f9f9f9;
    text-shadow: .75px .75px 0px #f9f9f9, .75px 0px 0px #f9f9f9, 0px .75px 0px #f9f9f9, -.75px 0px 0px #f9f9f9, 0px -.75px 0px #f9f9f9, -.75px .75px 0px #f9f9f9, .75px -.75px 0px #f9f9f9, -.75px -.75px 0px #f9f9f9;
width: 76%;
    float: right;
    display: inline-block;
    z-index:1;
}

.tabsy-border { 
border:solid 1px #e3e3e3;
border-top:none;
padding:10px 12px 0px 10px;
height:26px;
background-color:#e9e9e9; }


</style>

Код:

[block="tabsy"]

[block="tabsy-banner"]

[img]https://i.pinimg.com/564x/4c/46/55/4c4655a66f171aad649fe23097894d3e.jpg[/img]

[block="tabsy-banner-name"]
[align=center]Название[/align]
[/block]
[block="tabsy-quote-words"]
[align=center]i get up, and nothing gets me dow[/align]
[/block]
[/block]

[tabtitle=ава]Аватары[/tabtitle]
[tabtitle=отн]Отношения[/tabtitle]
[tabtitle=эп]Эпизоды[/tabtitle]

[tab=ава][tabdefault]

1


[/tab]

[tab=отн]

2


[/tab]

[tab=эп]

3

[/tab]

[/block]

Итоговый пример:

Цитировать Сообщение 198

Поделиться19926.06.24 19:05

Автор: Automation Baby
Атаманша
Последний визит:
18.08.24 17:56
Уважение: +9027

Will O The Wisp
Круто! Можно твоё оформление добавить к скрипту? Конечно же я подпишу что оформитель ты.

Подпись автора

Отвечаю на вопросы вот здесь | Мой блог

Поделиться20026.06.24 19:52

Автор: Will O The Wisp
Участник
Последний визит:
10.12.24 18:09
Уважение: +594

Automation Baby
Да, пожалуйста, если есть желание. Второе оформление тоже могу выложить, но оно громоздкое и сложное.

Цитировать Сообщение 200

Ответить

Страница: « 1 … 18 19 20 21 »

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»

Имя

font_download format_size format_bold format_italic format_underlined strikethrough_s format_paint color_lens

format_align_left format_align_center format_align_right list table_view

link add_photo_alternate ondemand_video mood mic

content_cut lock_open format_quote code

horizontal_rule anchor live_help emoji_symbols library_add

ТочкамиDots

КружочкамиCircles

КвадратамиSquares

ЦифрамиNumbers

Римскими цифрамиRoman Numerals

Без обозначенийNo Markers

Многострочный пункт спискаMultiline List Item

ТекстText

HTML

Javascript

Bebas Neue Arial Georgia Microsoft Sans Serif Tahoma Verdana Century Gothic Palatino Linotype Times New Roman Franklin Gothic Medium Impact Arial Black Courier New Lucida Console Comic Sans Ms

10px 12px 14px 16px 18px 20px 22px

ЗаголовокTitle Автосжатие больших картинокAuto-resize large images Скрыть от гостейHide from guests Ссылка «скачать» Download link Имя читателяReader's name Добавлено спустя…Added after... Надстрочный текстSuperscript text Подстрочный текстSubscript text БлокBlock HTML иконка

Скрыть инструментарий Показать инструментарий

Теги оформления специальных постов

Сделать пост специальным[block="portfoliopost"]portfoliopost[/block],

Светлый фон[block="makeportfoliolight"]makeportfoliolight[/block],

Красный пост[block="saledpost"]saledpost[/block],

Синий пост[block="forsalepost"]forsalepost[/block],

Зеленый пост[block="freepost"]freepost[/block],

Пост без профиля[block="no-prof"]no-prof[/block],

Теги оформления картинок

Обложки: Для одной картинки по центру в рамке, автоматически уменьшается до ширины 480px

Обложка[block="cover"][block="picture"][img]ссылка на картинку,[/img][/block][/block]

Закрыто[block="cover"][block="icon material-icons"]lock[/block][block="picture"][img]ссылка на картинку,[/img][/block][/block]

Продажа[block="cover"][block="icon fa-solid fa-sack-dollar"][/block][block="picture"][img]ссылка на картинку,[/img][/block][/block]

Подарок[block="cover"][block="icon fa-solid fa-gift"][/block][block="picture"][img]ссылка на картинку,[/img][/block][/block]

Превью: Для любого количества картинок по центру в рамке, автоматически уменьшается до ширины или высоты 300px

Блок для превью[block="morepics"],[/block]

Разноцветные картинки-ссылки: Для любого количества картинок по центру в разноцветных рамках с заголовком, автоматически уменьшается до ширины 350px, минимальная высота 230px (если высота больше, картинка "обрезается" снизу, но не сжимается)

Блок для картинок-ссылок[block="port-block"],[/block]

Красный[block="p-out saled"] [url=ссылка]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block] [/block]

Синий[block="p-out forsale"] [url=ссылка]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block] [/block]

Зеленый[block="p-out free"] [url=ссылка]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block] [/block]

Желтый[block="p-out yellow"] [url=ссылка]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block] [/block]

Теги оформления контента

Обведенный текст[block="details"] [block="det"],[/block] [/block]

Добавить еще блок[block="det"],[/block]

Блок с кнопками[block="links"] [block="demo"][url=ссылка]синяя кнопка,[/url][/block] [block="store"][url=ссылка]оранжевая кнопка[/url][/block] [/block]

Синяя кнопка[block="demo"][url=ссылка]текст,[/url][/block]

Оранжевая кнопка[block="store"][url=ссылка]текст,[/url][/block]

добавить работу [block="wow bounceIn p-out,"] иконка [block="p-descr"][url=https://forumd.ru/viewtopic.php?id=]описание[/url][/block] [block="p-inner"][url=https://forumd.ru/viewtopic.php?id=][img]картинка[/img][/url][/block] [/block]

Иконки:

lock[block="icon material-icons"]lock,[/block]

[block="icon fa-solid fa-sack-dollar"],[/block]

[block="icon fa-solid fa-gift"],[/block]

ТЕГИ (вставить в p-out через пробел)

Тип работы:

под заказ saled,

на продажу forsale,

бесплатно free,

Основная категория:

Вебдизайн dis,

(для всего связанного с работой на сайтах/форумах, кроме готовых скриптов и мелкой графики)

Графика graf,

(для графона, НЕ включающего кодинг/скрипты)

Скрипты/коды code,

(для готовых разработок и работы по верстке/кодингу)
Мини-фильтры дизайнов:

адаптивные mob,

ролевые игры frpg,

компьютерные игры game,

нейтральные flat,

Подкатегории:

Дизайн форумов/сайтов fulldis,

(для полных работ по дизайну)

Макеты layout,

(для дизайнов, где только макет без кода, или работ по созданию макетов чего-либо)

Верстка dis-code,

(для работ по верстке чужих дизайнов или отдельных штук)

Соц-сети/стримы graf-s,

(графон для оформления соцсетей/стримов)

Ролевая графика/арт art,

(для мелкой графики)

Javascript/CSS js,

(для скриптов или выложенных цсс кодов)

Бесплатный диз от FD [block="p-out free fd"] [url=https://forumd.ru/viewtopic.php?id=]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block][/block]

Платный диз от FD [block="p-out forsale fd"] [url=https://forumd.ru/viewtopic.php?id=]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block][/block]

Дизайн от юзеров [block="p-out yellow"] [url=https://forumd.ru/viewtopic.php?id=]заголовок,[/url] [block="picture"][img]ссылка на картинку[/img][/block][/block]

ТЕГИ (вставить в p-out через пробел)

Платформа:

MyBB.ru mybb-ru,

Макет (любая платформа) any,

Параметры:

+ PSD psd-in,

(в наличии макет помимо кодов)

+ адаптивка mob,

(есть версия для мобилок)

Тематика:

нейтральные flat,

ролевые игры frpg,

компьютерные игры game,

фентези fant,

аниме anime,

кино/сериалы kino,

стимпанк/киберпанк cyb,

мультфильмы kids,

животные cats,

Цвета:

тёмные darkst,

светлые light,

яркие bright,

добавить скрипт/код [block="SCRBLOCK"] [block="stforlink"] иконка, [block="link"][url=https://forumd.ru/viewtopic.php?id=]название[/url][/block] [/block] [block="sttags"] теги [/block] [/block]

Иконки:

[block="icon fa-brands fa-js"],[/block]

[block="icon fa-brands fa-css3-alt"],[/block]

[block="icon fa-regular fa-file-lines"],[/block]

[block="icon fa-solid fa-file-code"],[/block]

[block="icon fa-solid fa-file-invoice-dollar"],[/block]

ТЕГИ (*значение в скобках вставить в SCRBLOCK через пробел)

Тип кода:

скрипт (js)[block="js"]скрипт, js[/block]

css код (css)[block="css"]css код, css[/block]

HTML/CSS шаблоны (shab)[block="shab"]HTML/CSS шаблоны, shab[/block]

Модули/Расширения (global)[block="global"]Модули/Расширения, global[/block]

Платформа:

MyBB.ru (mybb-ru)[block="mybb-ru"]MyBB.ru, mybb-ru[/block]

Любой движок (any)[block="any"]Любой движок, any[/block]

Тип для форума:

Пользователи (users)[block="users"]Пользователи, users[/block]

Профиль (userprof)[block="userprof"]Профиль, userprof[/block]

Доп. поля профиля (adfield)[block="adfield"]Доп. поля профиля, adfield[/block]

Аватары (avatars)[block="avatars"]Аватары, avatars[/block]

Репутация (repa)[block="repa"]Репутация, repa[/block]

Группы (groups)[block="groups"]Группы, groups[/block]

Гoсти (guest)[block="guest"]Гoсти, guest[/block]

Администраторы (admins)[block="admins"]Администраторы, admins[/block]

Модераторы (moders)[block="moders"]Модераторы, moders[/block]

Регистрация (regis)[block="regis"]Регистрация, regis[/block]

Личные сообщения (ls)[block="ls"]Личные сообщения, ls[/block]

Вход (login)[block="login"]Вход, login[/block]

Подписки (subsc)[block="subsc"]Подписки, subsc[/block]

Поиск (search)[block="search"]Поиск, search[/block]

Цитирование (quotes)[block="quotes"]Цитирование, quotes[/block]

Пагинация (pagin)[block="pagin"]Пагинация, pagin[/block]

Опросы (polls)[block="polls"]Опросы, polls[/block]

Смайлы (smiles)[block="smiles"]Смайлы, smiles[/block]

Фикс скриптов QuadroBoards (qbfix)[block="qbfix"]Фикс скриптов QuadroBoards, qbfix[/block]

Страница форума:

На всех страницах (allpages)[block="allpages"]На всех страницах, allpages[/block]

Страницы (созд. в админке) (fpages)[block="fpages"]Страницы (соз. в админке), fpages[/block]

Главная страница (mainpage)[block="mainpage"]Главная страница, mainpage[/block]

Объявление (announ)[block="announ"]Объявление, announ[/block]

Категории (categ)[block="categ"]Категории, categ[/block]

Форумы (forums)[block="forums"]Форумы, forums[/block]

Статистика (stats)[block="stats"]Статистика, stats[/block]

Список тем (topiclist)[block="topiclist"]Список тем, topiclist[/block]

Страница профиля (profpage)[block="profpage"]Страница профиля, profpage[/block]

Тема (topics)[block="topics"]Тема, topics[/block]

Сообщения (posts)[block="posts"]Сообщения, posts[/block]

Контент сообщений (p-content)[block="p-content"]Контент сообщений, p-content[/block]

Рейтинг постов (p-repa)[block="p-repa"]Рейтинг постов, p-repa[/block]

Профиль автора поста (p-prof)[block="p-prof"]Профиль автора поста, p-prof[/block]

Форма ответа (fo)[block="fo"]Форма ответа, fo[/block]

Модификация ФО (fomod)[block="fomod"]Модификация ФО, fomod[/block]

Новые BB-теги (newbb)[block="newbb"]Новые BB-теги, newbb[/block]

Инструментарий спец тем/постов (spesh)[block="spesh"]Инструментарий спец тем/постов, spesh[/block]

Универсальные теги:

Дизайн/стиль (dis)[block="dis"]Дизайн/стиль, dis[/block]

Замена элементов/атрибутов (chan)[block="chan"]Замена элементов/атрибутов, chan[/block]

Загрузка (load)[block="load"]Загрузка, load[/block]

Переадресация (redir)[block="redir"]Переадресация, redir[/block]

Скроллинг (scroll)[block="scroll"]Скроллинг, scroll[/block]

Виджеты (vidjet)[block="vidjet"]Виджеты, vidjet[/block]

Меню (menu)[block="menu"]Меню, menu[/block]

Вкладки (ttabs)[block="ttabs"]Вкладки, ttabs[/block]

Галереи (gall)[block="gall"]Галереи, gall[/block]

Слайдеры (sliders)[block="sliders"]Слайдеры, sliders[/block]

Ротаторы (rotat)[block="rotat"]Ротаторы, rotat[/block]

Таймеры/даты (timers)[block="timers"]Таймеры/даты, timers[/block]

Спойлеры (spoilers)[block="spoilers"]Спойлеры, spoilers[/block]

Реклама (adv)[block="adv"]Реклама, adv[/block]

Изображения (pics)[block="pics"]Изображения, pics[/block]

Медиа (media)[block="media"]Медиа, media[/block]

Ролевые игры (frpg)[block="frpg"]Ролевые игры, frpg[/block]

Hover-эффекты (hover)[block="hover"]Hover-эффекты, hover[/block]

Анимация (anim)[block="anim"]Анимация, anim[/block]

Украшения (decor)[block="decor"]Украшения, decor[/block]

Праздники (seleb)[block="seleb"]Праздники, seleb[/block]

Ограничения/запреты (stops)[block="stops"]Ограничения/запреты, stops[/block]

Антикопирование (nocopy)[block="nocopy"]Антикопирование, nocopy[/block]

Уведомления (notif)[block="notif"]Уведомления, notif[/block]

ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов

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

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

Объявление

🎧 Подкаст «НЕТЕРОЛЕВЫЕ»

🍁 Что такое осень? Конкурс осенних дизайнов!

🔥 Акция! Осенние скидки на Мгновенные уведомления

❤️ Поддержи проект! Стань модератором!

💌 Акция! Подписка, лайк, коммент, репост!

🌟 SPECIAL OFFER: We distribute designs for free

❤️ Support the project

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

Эксперименты Will O The Wisp

Сообщений 191 страница 200 из 203

Поделиться19102.06.24 19:40

Поделиться19202.06.24 21:28

Поделиться19302.06.24 22:22

Поделиться19416.06.24 22:39

Поделиться19520.06.24 11:09

Поделиться19620.06.24 11:31

Поделиться19720.06.24 11:57

Поделиться19826.06.24 16:57

Поделиться19926.06.24 19:05

Поделиться20026.06.24 19:52

Быстрый ответ

Теги оформления специальных постов

Теги оформления картинок

Теги оформления контента