nikki4
-
Posts
151 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by nikki4
-
-
Спасибо, обнаружил следующее:
Все оказалось проще, у свг высота 160, соответсвенно при уменьшении - сжимается и становится маленьким.
У гифки , которую я сделал из свг - другие пропорции почему-то получились и в итоге нормально отображается.
В общем надо как-то поменять пропорцию у свг
-
<div class="logo"> <a href="/" class="logo-link"> <img src="/logo.svg" class="logo-svg"> </a> </div>
.logo { width: 250px; height:100%; }
Как сделать, чтобы лого было шириной 250 и высотой 100%? т.е. во весь блок.
Если выбрать GIF лого - оно само растягивается. SVG же автоматом уменьшается визуально.
как я понял, надо что-то в самом свг поправить:
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1407.9 938.4" style="enable-background:new 0 0 1407.9 938.4;" xml:space="preserve">
Пробовал менять preserve на
default, но не сработало
Может тут что-то еще надо поменять?
-
Сейчас блок черный, можно ли его сделать его зеленым через css?
изменять html нельзя (генерируется на стороннем сервере через скрипт)
<div id="mainblock"> <block> <block> <block style="background:black !important;"></block> </block> </block> </div> #mainblock block block block { width:200px; height:200px; display:block; background: green !important; }
-
Есть слайдер. Чтобы скрыть слайды, у блока lsbslider стоит overflow: hidden;
У слайдера есть стрелки навигации. - .left
хочу сместить стрелку левее от блока. т.е. чтобы стрелка была вот так:
Вопрос как сделать ,чтобы она не пропадала. Сейчас стрелку не видно, так как у блока выше overflow:hidden
<div class="lsbslider"> <a class="left" href="#" role="button"></a> </div> .lsbslider {width: 300px; position: fixed; left: 100px; height: 200px; background:coral; overflow: hidden; } .left { left:-30px; } .left { position: absolute; display: flex; width: 30px; height: 50px; background: black; }
-
Задача - появление блока внизу экрана спустя определенное время.
например для теста через 5 секунд, в течение 3х секунд всплытие
.block { display:block; width:100%;max-height:340px; height:220px; position:fixed; background:coral; bottom: 0; max-width:900px; animation:anim 3s; animation-duration:anim 3s; -webkit-animation-delay: 5s; -moz-animation-delay: 5s; -o-animation-delay: 5s; animation-delay: 5s; } @keyframes anim { from {bottom:-100%;} to {bottom:0;} }
Если не добавлять задержку выезжает через 3 сек.
если добавить - сразу появляется и задержки нет.
разобрался с вопросом. Надо было изначально скрыть блок и в анимацию добавить появление:
@keyframes show{ 0%{ opacity:1; } 100% { opacity:1; } from {bottom:-100%;} to {bottom:0;} }
-
-
При наведении на пункт меню нужно, чтобы кружок становился так же с фоном с ссылкой:
пробовал вместо li a, делать структуру a li
но тогда вообще пропадает кружок:
придумал способ, просто вставить span с кружком, но как ему задать стили, чтобы был по центру?
когда задаю ему фонтсайз, то он поверху становится
Придумал!
top: 20px; position: relative;
Но конечно это костыль.
Может можно сделать чтобы к li применялся фон и цвет при наведении на li a?
-
Сейчас фото дивана обрезается
Можно ли его целиком как-то отобразить?
знаю есть для этого overflow - не срабатывает.
-
В исходном коде в шаблоне я прописал, чтобы было так:
<div class="product-grid row"> <data data-bal="bal-elemen"></data> <div class="cols col-lg-4 col-md-4 col-sm-4 col-xs-4 zakonchilosvcat"> <div class="product zakonchilos">
Смотрю - а стиль на сайте к zakonchilosvcat не применяется.
Вижу. а этого стиля попросту нет в инспекторе! Проверял в других браузерах аналогично.
<div class="cols col-lg-4 col-md-4 col-sm-4 col-xs-4"> <div class="product zakonchilos">
При этом в исходном коде (ctrl-u) стиль этот есть.
Я не понимаю, как это возможно, в чем дело?
-
Слышал, что родительских селекторов верхнего уровня не существует, как тогда быть в такой ситуации:
страница контактов, при наведении на адрес должна появляется картинка (карта) сверху с соответствующим адресом
например при наведении на желтый, зеленый блок становился синим
-
У списка стоит
list-style-position: inside;
надо от кружочка сделать отступ.
если пишу обычный паддинг к li, тогда отступ происходит не от кружка, вместе с кружком
-
Уменьшил размер текста в списке, а кружок по сравнению с текстом остался таким же.
как и его уменьшить?
-
15 часов назад, Hasiev сказал:
@nikki4 Насчет аякса Вам надеюсь ответят, т.к я с ним еще не знаком .. Вот по поводу псевдо-элемента, но, повтарюсь, - это не решение!
Спасибо. Но почему-то на сайте не работало.
Скопировал код в кодпен - тоже не работает, но на jsfiddle работает. Не понимаю. От чего так?
-
44 минуты назад, Hasiev сказал:
Удалить в коде? Мб js их добавляет? Квадратиком можно, псевдо-элементом спозиционированным к примеру, но это не решение.
Поиск на аяксе, как понимаю работаю при помощи этого файла, но я не пойму как его тестировать.
пытаюсь всякие print_r, echo, die добавлять значения. Но тогда поиск перестает работать. Потому не могу выявить где хранится название и как его удалить. Подозреваю, что тут
Цитата$where = '(' . implode(') OR (', $wheres2) . ')';
но как узнать что там...
Скрытый текст<?php /** * @version $Id: virtuemart.php $ * @package Joomla * @copyright Copyright (C) 2005 - 2010 Open Source Matters. All rights reserved. * @license GNU/GPL, see LICENSE.php * Joomla! is free software. This version may have been modified pursuant * to the GNU General Public License, and as distributed it includes or * is derivative of works licensed under the GNU General Public License or * other free or open source software licenses. * See COPYRIGHT.php for copyright notices and details. */ // no direct access defined('_JEXEC') or die('Restricted access'); jimport( 'joomla.plugin' ) ; if (!class_exists( 'VmConfig' )) require(JPATH_ADMINISTRATOR . DS . 'components' . DS . 'com_virtuemart'.DS.'helpers'.DS.'config.php'); $config= VmConfig::loadConfig(); if(!class_exists('TableCategories')) require(JPATH_VM_ADMINISTRATOR.DS.'tables'.DS.'categories.php'); if (!class_exists( 'VirtueMartModelCategory' )) require(JPATH_VM_ADMINISTRATOR.DS.'models'.DS.'category.php'); if (!class_exists( 'VirtueMartModelProduct' )) require(JPATH_VM_ADMINISTRATOR.DS.'models'.DS.'product.php'); $show_prices = VmConfig::get('show_prices', 1); if ($show_prices == '1') { if (!class_exists('calculationHelper')) require(JPATH_VM_ADMINISTRATOR . DS . 'helpers' . DS . 'calculationh.php'); if (!class_exists('CurrencyDisplay')) require(JPATH_VM_ADMINISTRATOR . DS . 'helpers' . DS . 'currencydisplay.php'); } if(!version_compare(JVERSION,'1.6.0','ge')) { $mainframe->registerEvent('onSearch', 'plgSearchVmxsearch'); $mainframe->registerEvent('onSearchAreas', 'plgSearchVmxsearchAreas'); } function &plgSearchVmxsearchAreas() { static $areas = array( 'vmxsearch' => 'Products' ); return $areas; } function plgSearchVmxsearch($text, $phrase='', $ordering='', $areas=null) { $db = & JFactory::getDBO(); $user = & JFactory::getUser(); if (is_array($areas)) { if (!array_intersect($areas, array_keys(plgSearchVmxsearchAreas()))) { return array(); } } // load plugin params info $plugin = & JPluginHelper::getPlugin('search', 'vmxsearch'); $pluginParams = new JParameter($plugin->params); $limit = $pluginParams->def('search_limit', 50); $text = trim($text); if ($text == '') { return array(); } $section = JText::_('Products'); $wheres = array(); switch ($phrase) { case 'exact': $text = $db->Quote('%' . $db->getEscaped($text, true) . '%', false); $wheres2 = array(); $wheres2[] = 'a.product_sku LIKE ' . $text; $wheres2[] = 'p.product_name LIKE ' . $text; $where = '(' . implode(') OR (', $wheres2) . ')'; break; case 'all': case 'any': default: $words = explode(' ', $text); $wheres = array(); foreach ($words as $word) { $word = $db->Quote('%' . $db->getEscaped($word, true) . '%', false); $wheres2 = array(); $wheres2[] = 'a.product_sku LIKE ' . $word; $wheres2[] = 'p.product_name LIKE ' . $word; $wheres[] = implode(' OR ', $wheres2); } $where = '(' . implode(($phrase == 'all' ? ') AND (' : ') OR ('), $wheres) . ')'; break; } switch ($ordering) { case 'alpha': $order = 'p.product_name ASC'; break; case 'category': $order = 'b.category_name ASC, a.product_name ASC'; break; case 'popular': $order = 'a.hits DESC'; break; case 'newest': $order = 'a.created_on DESC'; break; case 'oldest': $order = 'a.created_on ASC'; break; default: $order = 'p.product_name DESC'; } $text = $db->Quote('%' . $db->getEscaped($text, true) . '%', false); $query = "SELECT DISTINCT CONCAT( p.product_name,' (',a.product_sku,')' ) AS title, a.virtuemart_product_id , b.virtuemart_category_id , a.created_on as created, '2' AS browsernav, (SELECT m.file_url AS path FROM #__virtuemart_medias AS m LEFT JOIN #__virtuemart_product_medias AS me ON m.virtuemart_media_id = me.virtuemart_media_id WHERE me.virtuemart_product_id = a.virtuemart_product_id ORDER BY me.ordering ASC LIMIT 1 ) AS image FROM #__virtuemart_products AS a LEFT JOIN #__virtuemart_products_".VMLANG." p ON p.virtuemart_product_id = a.virtuemart_product_id LEFT JOIN #__virtuemart_product_categories AS xref ON xref.virtuemart_product_id = a.virtuemart_product_id LEFT JOIN #__virtuemart_categories_".VMLANG." AS b ON b.virtuemart_category_id = xref.virtuemart_category_id LEFT JOIN #__virtuemart_product_medias AS pm ON pm.virtuemart_product_id = (SELECT IF(a.product_parent_id>0, a.product_parent_id, p.virtuemart_product_id)) LEFT JOIN #__virtuemart_medias AS media ON pm.virtuemart_media_id = media.virtuemart_media_id LEFT JOIN #__virtuemart_product_customfields AS c ON p.virtuemart_product_id = c.virtuemart_product_id" . ' WHERE (' . $where . ') AND a.published = 1 AND a.product_parent_id = "0" ' .' GROUP BY a.virtuemart_product_id ' . ' ORDER BY pm.ordering,' . $order ; $db->setQuery($query, 0, $limit); $rows = $db->loadObjectList(); if ($rows) { foreach ($rows as $key => $row) { $rows[$key]->href = 'index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=' . $row->virtuemart_product_id . '&virtuemart_category_id=' . $row->virtuemart_category_id; // $rows[$key]->text = $text; } } return $rows; } class plgSearchVmxsearch extends JPlugin { function onContentSearchAreas() { static $areas = array( 'virtuemart' => 'Products' ); return $areas; } /** * virtuemart Products Search method * * The sql must return the following fields that are used in a common display * routine: href, title, section, created, text, browsernav * @param string Target search string * @param string mathcing option, exact|any|all * @param string ordering option, newest|oldest|popular|alpha|category */ function onContentSearch($text, $phrase='', $ordering='', $areas=null) { $db = JFactory::getDbo(); $app = JFactory::getApplication(); $user = & JFactory::getUser(); $groups = implode(',', $user->getAuthorisedViewLevels()); $tag = JFactory::getLanguage()->getTag(); $searchText = $text; if (is_array($areas)) { if (!array_intersect($areas, array_keys($this->onContentSearchAreas()))) { return array(); } } // load plugin params info // $plugin = & JPluginHelper::getPlugin('search', 'virtuemart'); // $pluginParams = new JParameter($plugin->params); // $limit = $pluginParams->def('search_limit', 50); $limit = $this->params->def('search_limit', 50); $inStock = $this->params->def('instock', 0); /* TO do it work with date $nullDate = $db->getNullDate(); $date = JFactory::getDate(); $now = $date->toMySQL(); */ $text = trim($text); if ($text == '') { return array(); } $section = JText::_('Products'); $wheres = array(); switch ($phrase) { case 'exact': $text = $db->Quote('%' . $db->getEscaped($text, true) . '%', false); $wheres2 = array(); $wheres2[] = 'a.product_sku LIKE ' . $text; $wheres2[] = 'p.product_name LIKE ' . $text; $wheres2[] = 'c.custom_value LIKE ' . $text; $where = '(' . implode(') OR (', $wheres2) . ')'; break; case 'all': case 'any': default: $words = explode(' ', $text); $wheres = array(); foreach ($words as $word) { $word = $db->Quote('%' . $db->getEscaped($word, true) . '%', false); $wheres2 = array(); $wheres2[] = 'a.product_sku LIKE ' . $word; $wheres2[] = 'p.product_name LIKE ' . $word; $wheres2[] = 'c.custom_value LIKE ' . $word; $wheres[] = implode(' OR ', $wheres2); } $where = '(' . implode(($phrase == 'all' ? ') AND (' : ') OR ('), $wheres) . ')'; break; } if( $inStock ) { $where .= " AND a.product_in_stock > 0 "; } switch ($ordering) { case 'alpha': $order = 'p.product_name ASC'; break; case 'category': $order = 'b.category_name ASC, a.product_name ASC'; break; case 'popular': $order = 'a.hits DESC'; break; case 'newest': $order = 'a.created_on DESC'; break; case 'oldest': $order = 'a.created_on ASC'; break; default: $order = 'p.product_name DESC'; } // search product $text = $db->Quote('%' . $db->getEscaped($text, true) . '%', false); $query = "SELECT DISTINCT CONCAT( p.product_name,' (',a.product_sku,')' ) AS title, a.virtuemart_product_id , b.virtuemart_category_id , a.created_on as created, '2' AS browsernav, (SELECT m.file_url AS path FROM #__virtuemart_medias AS m LEFT JOIN #__virtuemart_product_medias AS me ON m.virtuemart_media_id = me.virtuemart_media_id WHERE me.virtuemart_product_id = a.virtuemart_product_id ORDER BY me.ordering ASC LIMIT 1 ) AS image FROM #__virtuemart_products AS a LEFT JOIN #__virtuemart_products_".VMLANG." p ON p.virtuemart_product_id = a.virtuemart_product_id LEFT JOIN #__virtuemart_product_categories AS xref ON xref.virtuemart_product_id = a.virtuemart_product_id LEFT JOIN #__virtuemart_categories_".VMLANG." AS b ON b.virtuemart_category_id = xref.virtuemart_category_id LEFT JOIN #__virtuemart_product_medias AS pm ON pm.virtuemart_product_id = (SELECT IF(a.product_parent_id>0, a.product_parent_id, p.virtuemart_product_id)) LEFT JOIN #__virtuemart_medias AS media ON pm.virtuemart_media_id = media.virtuemart_media_id LEFT JOIN #__virtuemart_product_customfields AS c ON p.virtuemart_product_id = c.virtuemart_product_id" . ' WHERE (' . $where . ') AND a.published = 1 AND a.product_parent_id = "0" ' .' GROUP BY a.virtuemart_product_id ' . ' ORDER BY pm.ordering,' . $order ; $db->setQuery($query, 0, $limit); $rows = $db->loadObjectList(); if ($rows) { foreach ($rows as $key => $row) { $rows[$key]->href = 'index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=' . $row->virtuemart_product_id . '&virtuemart_category_id=' . $row->virtuemart_category_id; $rows[$key]->price = $this->getPrice($row->virtuemart_product_id); // $rows[$key]->text = $text; } } return $rows; } function getPrice($pid) { if (!class_exists('CurrencyDisplay')) { require_once(JPATH_VM_ADMINISTRATOR . DS . 'helpers' . DS . 'currencydisplay.php'); } $product_model = VmModel::getModel('product'); $currency = CurrencyDisplay::getInstance(); $product = $product_model->getProduct($pid,TRUE,TRUE,TRUE,1); $p = str_replace("PricesalesPrice", "", $currency->createPriceDiv ('salesPrice', '', $product->prices)); return $p; } }
Вот думаю может как-то стилями можно. Раз нельзя удалять символами, видимо придется прятать за блоком псевдожлемента
-
Поставил форму поиска, там почему-то на конце после названия выводятся ()
Т.е.
<span>Название1 ()</span> <span>Название2 ()</span>
Можно ли как-то стилями скрыть все скобки в спанах, либо последние 3 символа?
Если нет, то может как-то можно квадратиком фоновым на передний план поместить?
-
Страница:
в мобильной версии разделы сайта должны быть во всю ширину.
@media only screen and (max-width: 479px) { *** .site-categories ul li { float: left; display: table; width: 96%; margin: 0 1% 20px; padding: 10px 1%; // border-radius: 5px; height: 100px; max-height: 100px; } *** }
в лисе и Яб-е, все ок. а в хроме почему-то не срабатывает @media only screen and (max-width: 479px) {
и применяется прежний стиль, а именно
only screen and (max-width: 991px) and (min-width: 768px)
Попытался выяснить в чем дело:
Полностью очистил файл responsive.css и style.css
в style.css написал:
body {background: red;} @media only screen and (max-width:784px) { body {background: blue;} }
везде все работает - красный, при экране с заданным размером - голубой фон.
стоит мне указать какое либо значение менее 784, например 783
body {background: red;} @media only screen and (max-width:783px) { body {background: blue;} }
везде работает, а в хроме уже не работает и не применяется стиль
Нашел решение. Оказалось в html было не прописано, прописал - стало все ок.
<meta name="viewport" content="width=device-width,initial-scale=1">
-
В 22.08.2017 в 17:05, kattiperk сказал:
да так и есть. файрбаг тоже показывает 100 высота.
но мои глаза видят, что на самом деле тут пикселей больше именно в этих 2 браузерах.
Делаю принскрин, вставляю в фотошоп и что видим? Вот я вижу, что браузеры увеличивают все на 20%.. но где это отключить, чтобы нормально все верстать.
-
Ну понятно что инспектором проверять надо, а не скринами. В то то и дело в css и инспекторе одно, а на экране другое. Я не поверил инспектору и решил проверить скринами.
Вот, кстати закончил верстать ,чтобы более менее ок выглядело.
Но на самом деле в хроме и лисе одно, а в яндексе другое. В яндексе нормальный размер, в ФФ и хроме - увеличено все примерно на 20%.
Может у меня настройки браузера какие-то.. типа автоувеличение.. но жму масштаб 100%.. ничего не меняется.
Но в любом случае из-за такого верстать не удобно.. может как-то отключить можно.
-
Открываю psd макет, беру линейку. Измеряю какой-либо элемент, например высоту шапки.
Прописываю высоту в пикселях и т.д. Но все едет и кажется огромным.
Делаю принтскрин, вставляю поверх psd макета, видно что высота стала гораздо больше, например шапка 400px а в принтскрине уже 500px.
От чего так? Изображение браузера стоит 100%, пробовал менять браузер - всеравно крупнее на сайте, чем в макете, хотя высоту прописал точно как в макете. Проверял единицы измерения в фотошопе - все верно
Может искажается при принскрине размеры? но проверил по ширине - вместо 1920 - 1900 за счетполосы прокрутки. Так что не могло прям на 100 пикселей пропасть, да и сам реально вижу, что все выглядит крупнее в браузерах.
Ничего не понимаю..
ps: только что еще раз проверил в браузерах тестовый пример:
яндексбраузер - ничего не увеличивает, выдает как надохром и ФФ укрупняют на 20%
или вот вставляю картинку шириной 1920px (мой экран 1920)
в итоге картинка гораздо больше на экране и целиком не влезает в экран.
Отправил файл с html+css
У меня это отображается так:
Скрытый текстСкрытый текстhtml+css:
Скрытый текст<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link href="style.css" rel="stylesheet"> </head> <body> <div class="header">.header {height:100px; background:coral;}</div> <div class="banner"></div> </body> </html>
.header {height:100px; background:coral;} .banner{ height:521px; max-height:100%; width:100%; max-width:1920px; background-image:url("3foto.jpg"); }
-
Задача такая:
есть слайдер. если включен первый слайд (первый блок owl-page с классом active), тогда все другие owl-page сделать одним цветом.
Т.е. стили только для тех элементов которые идут после первого активного, так как если слайдер поменяется, то цвет изменится.
-
Вот наброски, пробовал с :nth-child не сработало
-
Всеравно что-то не понял с отступами, зато с флексом подвижки есть, однако слева откуда-то лишний отступ взялся/
да и всетаки делать фиксированно 25% каждобу блоку - так не правильно, надо чтобы маленький блок был меньше, а большой больше.
(решил задачу присвоим ширину в процентов каждому пункту меню в отдельности)
-
1 час назад, Igor Schnaider сказал:
У элементов списка уберите float. Для псевдоэлемента :after display должен быть inline-block и ширина 100%. Ну и нужны пробелы между элементами списка, иначе как им выравниваться по ширине.
P. S. Верстка ужасная, если честно ¯\_(ツ)_/¯
Спасибо за ответ, поправил. Но не понял, что за пробелы между элементами списка?
паддинги/маржины? но тогда это вручную под каждый экран нужно делать, а задача то, чтобы автоматически по ширине распределялось.
пробовал ширину ставить, типа 20%.
но тогда все съезжает при другом разрешении экрана, потому что для запеканки нужен больший блок, чем для других.
-
Нашел статью, пробовал вставить пример на сайт, но не вышло - просто обрезался край.
А нужно чтобы во всю ширину меню были расположены пункты меню. Видимо какой-то из стилей перекрывает, но не понял что именно.
Drop Shadow в хроме и фф выглядит по разному
in HTML Coding
Posted
drop-shadow(0.2px 0.2px 0.2px white)
В хроме выглядит аккуратно, придает жирности.
А вот в ФФ одно накладывается на другое и все размывается.
Как это привести к единому виду?