Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Info Coronavirus/Vaccinare vs Fake News

TVSat GO

Targuri de Craciun

Comutator radiator "Somogyi&#...
 Durere os sacru / coccis

Riscul de a sta in preajma unui o...

Boxe

Xiaomi Smart Speaker IR Control
 Probleme instalare Windows 11

Campina PH singurul oras din jude...

Gareth Emery - Welcome To Your Life

Vanzare teren extravilan-se const...
 Imparatul Sponsian (de pe moneda ...

Cum e relatia voastra cu batranii?

Ieri s-au implinit 30 de ani de l...

Papuc electric sau prindere direc...
 

Background div cu forma neregulata. Se poate?

- - - - -
  • Please log in to reply
4 replies to this topic

#1
colombo2003

colombo2003

    Senior Member

  • Grup: Senior Members
  • Posts: 6,310
  • Înscris: 16.07.2008
Am un pop-up (dialog modal), intr-un <div> caruia, in css, i-am pus fundal alb ( = un dreptunghi alb, ca o coala de hartie)
Tot in css i-am pus si o imagine ca border (o panglica tricolora, forma neregulata; vezi atasament).

Problema este ca arata ca si cum as pune/suprapune panglica pe o coala alba de hartie. Si cum forma panglicii e neregulata, albul imi iese si in afara ei.
As vrea sa arate ca si cum as fi decupat cu foarfeca dupa forma panglicii, si background-ul div-ului (albul) sa fie doar la interior, si sa urmareasca si el conturul panglicii.

Intrebarea este daca se poate face ceea ce vreau, si daca da, cum? Vreo idee? Multumesc

Attached Files



#2
Mizu

Mizu

    moroșan

  • Grup: Senior Members
  • Posts: 17,637
  • Înscris: 10.12.2006
Pune background panglica pe care o umpli cu alb in prealabil cu programul tau preferat de editare foto.

#3
LensFlare

LensFlare

    Tin Foil Mask Society

  • Grup: Senior Members
  • Posts: 14,430
  • Înscris: 09.05.2005
background transparent?

#4
whitewizard

whitewizard

    Softpedist pana la moarte!

  • Grup: Senior Members
  • Posts: 3,070
  • Înscris: 07.05.2006

View PostLensFlare, on 14 decembrie 2014 - 07:29, said:

background transparent?
Eu zic ca un png rezolva problema.

Attached Files


Edited by whitewizard, 14 December 2014 - 07:43.


#5
colombo2003

colombo2003

    Senior Member

  • Grup: Senior Members
  • Posts: 6,310
  • Înscris: 16.07.2008
Am incercat si cu background transparent, desigur, dar nici  asa nu mi-a iesit. Apoi am incercat cu atasamentul tau @whitewizard (merci), dar nici asa nu a functionat).

Poate ar trebuie sa dau mai multe detalii despre cod (foarte posibil ca de aici vine problema). Asa cum am spus, este vorba despre o fereastra de tip modal dialog (multumesc OriginalCopy).
Acesteia i-am spus background alb, iar background-ul care sa-mi acopere site-ul (sa nu pot face click pe ceva in afara acestei ferestre modale) este un gri. Opacitatea este setata la 0.95.

Pun si un border acestei ferestre modale (div), dar, dupa cum spuneam, background-ul div-ului care contine mesajul propriu-zis pe care vreau sa il afisez, ca forma, este dreptunghiular (ca o coala de hartie alba).
Borderul apare si el (acea panglica tricolora), numai ca ea, pamglica, avand forma neregulata, imi iese in afara ei albul de la celalalt div. Si tocmai asta nu reusesc.

Codurile sunt asa:
in pagina principal php:
<body onload="overlay()">
...
...
...
<div id="popUpDiv">
 <div>
 <a href="javascript:close()"><img alt="" src="images/close.jpg" /></a>

 <br>Stimati client............(textul cu programul de sarbatori)....<br>
 </div>
</div>
...
...
...


in css:
...
...
body {
   margin:0;
   padding:0;
}

@font-face {
   font-family: "Arhaic_rom";
   src: url(../fonts/Arhaic_rom.eot), url(../fonts/Arhaic_rom.ttf);
  // format('truetype');
}

#popUpDiv img {
	float: right;
	display: block;
	width: 5%;
	margin: -15px -15px 0 0;
}

#popUpDiv {
	 //visibility: hidden;
	 position: fixed;
	 left: 0;
	 top: 0;
	 width: 100%;
	 height: 100%;
	 text-align: center;
	 z-index: 9999;
	 background-color: #cccccf;
	 opacity: 0.95;
}

#popUpDiv div {
	 width: 300px;
	 margin: 100px auto;
	 background-color: #fff;
	 border: 1px solid #000;
	 padding: 15px;
	 text-align: center;

	 border: 10px solid #AAAAAA;
	 margin: 0 auto;
	 margin-top: 20px;
	 padding: 10px;
	 border: 50px solid transparent;
	 //width: 250px;
	 padding: 10px 20px;
	 width: 32%;
	 border-image: url(/images/bordertransp.png) 25 25 round;
	 -webkit-border-image: url(/images/bordertransp.png) 25 25 round;
	 -o-border-image: url(/images/bordertransp.png) 25 25 round;
}
...
...
...


Deci...?

Anunturi

Chirurgia spinală minim invazivă Chirurgia spinală minim invazivă

Chirurgia spinală minim invazivă oferă pacienților oportunitatea unui tratament eficient, permițându-le o recuperare ultra rapidă și nu în ultimul rând minimizând leziunile induse chirurgical.

Echipa noastră utilizează un spectru larg de tehnici minim invazive, din care enumerăm câteva: endoscopia cu variantele ei (transnazală, transtoracică, transmusculară, etc), microscopul operator, abordurile trans tubulare și nu în ultimul rând infiltrațiile la toate nivelurile coloanei vertebrale.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate