Задать вопрос

Buck

Лайки

  • Как добиться такого эффекта при наведении?

    Get-Web
    @Get-Web Куратор тега CSS
    Front-End Developer
    Интересная задача. В общем весь фокус в том, что поверх видимых карточек, лежит точно такая же сетка с невидимыми карточками у которых есть только синий border. На сетку, которая лежит сверху, наложена маска:
    mask: radial-gradient(320px 320px at var(--x) var(--y), black 1%, transparent 40%);

    То есть у всего блока с синими border остается видимым только радиальный градиент в 320px, а x и y это координаты курсора. Ну и грубо говоря получается такая картина:

    Ответ написан
    4 комментария
    4 комментария

  • Как записывать данные в texarea из CKEditor 5 Balloon Block?

    @sequelone Автор вопроса
    Разобрался в проблеме. Не в ту секцию код пихал. Вот рабочий вариант:

    <script src="https://cdn.ckeditor.com/ckeditor5/21.0.0/balloon-block/ckeditor.js"></script>
<script src="https://cdn.ckeditor.com/ckeditor5/21.0.0/balloon-block/translations/ru.js"></script>
<script>
  const textarea = document.querySelector( '#editor' );
	BalloonEditor.create( textarea , {
	      language: 'ru',
        removePlugins: [ 'Table' ],
        toolbar: [ 'bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote' ]
    })
		.then( editor => {
			window.editor = editor;
			
			editor.model.document.on( 'change:data', ( evt, data ) => {
            console.log( data );
            $('textarea#tickets-editor').html( editor.getData() );
        } );
		} )
		.catch( error => {
			console.error( 'There was a problem initializing the editor.', error );
		} );
</script>


    Тоесть надо было в секцию .then( editor => {...} код добавить:

    .then( editor => {
			window.editor = editor;
			
			editor.model.document.on( 'change:data', ( evt, data ) => {
            console.log( data );
            $('textarea#tickets-editor').html( editor.getData() );
        } );
		} )
    Ответ написан
    Комментировать
    Комментировать

  • Как в NextJs объединить два ajax запроса в getInititalProps?

    @dmitriu256 Автор вопроса
    Мой вариант решения
    Post.getInitialProps = async ({query, req}) => {
   //console.log(query);
    if(!req){
        return ({post: null})
    }

    const postApi = await fetch(`https://jsonplaceholder.typicode.com/posts/${query.id}`);
    const post = await postApi.json();

    //Получаем id пользователя
    const userId = post.userId;

    const userApi = await fetch(`https://jsonplaceholder.typicode.com/users/${userId}`);
    const user = await userApi.json();
   
    return ({post: post, name: user.username});
}
    Ответ написан
    Комментировать
    Комментировать

  • Как скрыть option в select при выборе другого option в select?

    0xD34F
    @0xD34F Куратор тега JavaScript 
    const first = document.querySelector('#first');
const second = document.querySelector('#second');

const showOptions = {
  1: [ '1', '11', '16' ],
  2: [ '12', '14', '15' ],
};

first.addEventListener('change', function() {
  const toShow = showOptions[this.value];
  [...second.options].forEach(n => n.hidden = +n.value && toShow && !toShow.includes(n.value));
});
    Ответ написан
    3 комментария
    3 комментария