I have contact details of different places in my DB, the names of these
different places are displayed as links in a page, what i want is for the
contact details of a place to be displayed in a tooltip when i click on the
link name of that place. But that is not happening! What happens is that
when i click the name of the place i get 2 tooltips stacked on top of each
other displaying the wrong information!
*TOOLTIP CSS code*
*#branch1 {outline:none; position: relative; font-weight: bold;}#branch1
{text-decoration:none;}/*#branches .contacts {}*/span.contacts1{
display:inline; position:absolute; color:#111; border:1px solid #000000;
background: #000000; opacity: 0.9; color: white; font-weight: bold;
font-size: small; border:1px solid #000000; border-radius:
25px;/*border-radius: 5px 100px 5px;*/; z-index:1; left: 40px;
display:none; padding:14px 15px; margin-top:-56px; margin-left:70px;
width:500px; line-height:16px;line-height:20px; }.callout
{z-index:20;position:absolute;top:30px;border:0;left:-12px;} /*CSS3
extras*/CONTROLLER CODE*
*def companies(): results=db.services(request.args(0))
rslts=db(db.company.services==results.id).select(db.company.ALL,
orderby=db.company.company_name) return locals()THE VIEW*
*<script> $(document).ready(function(){
$('.branch1').click(function(e) { $(this).each(function(){
$('.contacts1').fadeIn();
e.preventDefault(); }); });
$('img#close').click(function(e) {
$('.contacts1').fadeOut(); e.preventDefault();
}); }); </script> <div class="comps"><span
class="companies">COMPANIES (A-F)</span><br /><br />{{letters=['A', 'B',
'C', 'D', 'E', 'F'] for company in rslts: if
company.company_name[0] in letters: company.company_name }}<a
href="#" id="branch1" class="branch1
branches">{{=company.company_name}}</a><br /><span class="contacts1"><a
href="#"><img src="{{=URL('static', 'images/close.png')}}" style="width:
50px; position: absolute; top:0px;right:0px;" id="close"/></a> <div
class="info" id="logo"> <img id="companyLogo" width="140px"
src="{{=URL('download', args=company.logo)}}" /><br /> <span
style="position: absolute; bottom:0px; left: 10px;">SESOA™</span>
</div> <div class="info" style="padding-left:5px; border-left: solid 1px
white;" id="details"> <span
class="companyName">{{=company.company_name}}</span> <hr
class="divider" /> <span class="contact" id="cell">TEL:
</span><strong style="color:green;">{{=company.tel}}</strong><br /><span
class="contact" id="cell">EM@IL: </span> <strong
style="color:green;">{{=company.email}}</strong><br /><span class="contact"
id="cell">CELL: </span><strong
style="color:green;">{{=company.cell}}</strong><br /> <span
class="contact" id="fb">Facebook: </span> <strong
style="color:green;">{{=company.facebook}}</strong><br /> <span
class="contact" id="twit">Twitter: </span> <strong
style="color:green;">{{=company.twitter}}</strong><br /> <a
href="{{=company.website}}" target="_blank"><span class="contact"
id="e_mail">WEBSITE: </span> <strong
style="color:green;">{{=company.website}}</strong></span></a><br /><span
class="contact" id="cell">FAX: </span> <strong
style="color:green;">{{=company.fax}}</strong><br /><span class="contact"
id="cell">LOCATION: </span> <strong
style="color:green;">{{=company.located_at}}</strong><br />
</div></span> {{pass}} {{pass}}
</div><!----------------------------------------------------------------------------------------------------------------------------->*
--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to the Google Groups
"web2py-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
