Jump to content
  • 0

Вопрос знатокам


Leonidk
 Share

Question

Здравствуйте!

подскажите,как решить проблему.

фон - картинка, текст контента не имеет своего фона, менюшка тоже не имеет фона (общий фон картинка).

меню имеет выпадающее подменю на текст.

Вопрос: как сделать прозрачный текст под меню или чтобы фон в подменю повторял в точности основной фон?

Заранее благодарен!

Link to comment
Share on other sites

Recommended Posts

  • 0

ну тогда надо поизголяться над картинкой в фотошопе. Если еще сайт не резиновый, то можно засечь, в каком месте фона открывается меню, потом вырезать этот кусок из бг, поделить его на полоски для пунктов подменю(или как там у вас оно) и присвоить им.

Хотя есть подозрения, что невозможно пиксель в пиксель вырезать фрагмент.

Edited by Softlink
Link to comment
Share on other sites

  • 0

Здравствуйте!

подскажите,как решить проблему.

фон - картинка, текст контента не имеет своего фона, менюшка тоже не имеет фона (общий фон картинка).

меню имеет выпадающее подменю на текст.

Вопрос: как сделать прозрачный текст под меню или чтобы фон в подменю повторял в точности основной фон?

Заранее благодарен!

В таких случаях принято показывать скриншоты того как должно и не должно быть.

Link to comment
Share on other sites

  • 0

ну тогда надо поизголяться над картинкой в фотошопе. Если еще сайт не резиновый, то можно засечь, в каком месте фона открывается меню, потом вырезать этот кусок из бг, поделить его на полоски для пунктов подменю(или как там у вас оно) и присвоить им.

Хотя есть подозрения, что невозможно пиксель в пиксель вырезать фрагмент.

к сожалению резина

Link to comment
Share on other sites

  • 0

Здравствуйте!

подскажите,как решить проблему.

фон - картинка, текст контента не имеет своего фона, менюшка тоже не имеет фона (общий фон картинка).

меню имеет выпадающее подменю на текст.

Вопрос: как сделать прозрачный текст под меню или чтобы фон в подменю повторял в точности основной фон?

Заранее благодарен!

В таких случаях принято показывать скриншоты того как должно и не должно быть.

d931611022c7.jpg

менюшка будет выглядеть как ссылка на главную (контент естественно другой, содержание меню тож не это)

кинул все с варезника только, чтоб боле мене внешку видить.

обведено:

пункты подменю и грубо раайон блока подменю

Link to comment
Share on other sites

  • 0

как такое сделать на css - даже не представляю, но вот думаю можно сделать на js, причем если заюзать jQuery, то впринципе должно быть не очень сложно.

Принцип следующий:

во время ховера, узнаем позицию дропа, считаем расстояния от левого верхнего угла дропа до левого верхнего угла браузера, задаем на дроп такой же фон как и на бади, но со смещением, которое ранее узнали.

Link to comment
Share on other sites

  • 0

Реально может как-то извратиться и сделать точь в точь такие же части рисунка у пунктов подменю, как и натуральные, но ещё резина блин, вот тут думаю может картинки тада большие сделать.

Link to comment
Share on other sites

  • 0

а мне кажется, что тут вполне можно позаниматься фигурным вырезанием картинок.

Если на рисунке показана самая левая часть сайта, то понятно, что контент не сожмется до нуля, а ширина меню не будет на 100% сайта.

Грубо говоря, если выпадающее меню вместе с основным укладывается хотя бы в 400 пикселей, то вполне возможно все сделать. Только это нудно очень и надо как-то постараться аккуратненько вырезать. Ну это так.. мои размышления. А на JS может действительно проще будет.

Link to comment
Share on other sites

  • 0

тут никак не вырежешь, так как резина, хардкодить не стоит.

так ну и что, что резина. Меню не горизонтальное. А потому часть БГ для боди будет всегда на месте. В крайнем случае застолбить его там

background-position:left

. Пикселей 400 в ширину от левого края точно двигаться никуда не будут при любом разрешении. Вот отсюда и плясать.

а вообще не понимаю всей этой задумки. Для чего оно надо. Я думал там какая-то композиция интересная должна получиться в итоге :)

Link to comment
Share on other sites

  • 0

тут никак не вырежешь, так как резина, хардкодить не стоит.

так ну и что, что резина. Меню не горизонтальное. А потому часть БГ для боди будет всегда на месте. В крайнем случае застолбить его там

background-position:left

. Пикселей 400 в ширину от левого края точно двигаться никуда не будут при любом разрешении. Вот отсюда и плясать.

а вообще не понимаю всей этой задумки. Для чего оно надо. Я думал там какая-то композиция интересная должна получиться в итоге :)

Тоесть ты предлагаешь дать каждому пункту меню класс и для каждого из них жестко прописать бг? Тоесть пофиг изменения размера текста, изменения ширины меню ну и так далее?

Link to comment
Share on other sites

  • 0

Тоесть ты предлагаешь дать каждому пункту меню класс и для каждого из них жестко прописать бг? Тоесть пофиг изменения размера текста, изменения ширины меню ну и так далее?

Именно. Вырезай для выпадалки больший кусок бг и прибивай его тем же бг-позишн. Будет тянуться выпадалка - будет показываться скрытый бг. А про размер текста какого ты говоришь? Если в меню, то надо на берегу определиться, что лучше сделать. Все замерить и зафиксировать - будет хорошо. А текст в контенте вообще побоку.

тут вся сложность, как так точно замерить и вырезать.

Link to comment
Share on other sites

  • 0

Сделал демку на базе классического подхода Эрика. Если поведение фона при скроллинге не будет шокировать, то, имхо, это единственный вариант в рамках актуального CSS...

  • Like 2
Link to comment
Share on other sites

  • 0

А я предлагаю у выпадающего меню сделать кусок фона, который под ним, прям большую картинку с запасом. Именно у UL. А у самих пунктов просто пустота.

Тоесть ты предлагаешь дать каждому пункту меню класс и для каждого из них жестко прописать бг? Тоесть пофиг изменения размера текста, изменения ширины меню ну и так далее?

Нее, нафига каждому пункту? Просто самой выпадалке большой кусок и всё.

Link to comment
Share on other sites

  • 0

Сделал демку на базе классического подхода Эрика. Если поведение фона при скроллинге не будет шокировать, то, имхо, это единственный вариант в рамках актуального CSS...

Да, с фиксированным фоном - это круто.

Link to comment
Share on other sites

  • 0

Сделал демку на базе классического подхода Эрика. Если поведение фона при скроллинге не будет шокировать, то, имхо, это единственный вариант в рамках актуального CSS...

до сих пор сидел соображал как это работает, разобрался. SelenIT, а ты мастер на такие штуки хитрые. Прошлый раз для теней соорудил конструкцию :) Искушенный в этом деле - придумывать нестандартные решения?

Link to comment
Share on other sites

  • 0

Сделал демку на базе классического подхода Эрика. Если поведение фона при скроллинге не будет шокировать, то, имхо, это единственный вариант в рамках актуального CSS...

до сих пор сидел соображал как это работает, разобрался. SelenIT, а ты мастер на такие штуки хитрые. Прошлый раз для теней соорудил конструкцию :) Искушенный в этом деле - придумывать нестандартные решения?

Да, круто получилось. :)

Мне теперь это нужно догонять.. :)

Softlink, а что конструкция? можешь ссылку дать на неё?

Link to comment
Share on other sites

  • 0

а мне кажется, что тут вполне можно позаниматься фигурным вырезанием картинок.

Если на рисунке показана самая левая часть сайта, то понятно, что контент не сожмется до нуля, а ширина меню не будет на 100% сайта.

Грубо говоря, если выпадающее меню вместе с основным укладывается хотя бы в 400 пикселей, то вполне возможно все сделать. Только это нудно очень и надо как-то постараться аккуратненько вырезать. Ну это так.. мои размышления. А на JS может действительно проще будет.

Да действительно эта ширина 300

и наверное Ваш вариант более подходящий, т.к картинки будут примерно в 600х600

Link to comment
Share on other sites

  • 0

Да действительно эта ширина 300

и наверное Ваш вариант более подходящий, т.к картинки будут примерно в 600х600

у psywalker получше вариант. Меньше резать надо, соответственно качественней выйдет.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share


×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy