anasayfamda iframe'me nasıl defer yaparım ?

11 yıl

Yarbay

Konu Sahibi

anasayfamda bi iframe koydum ve asırı sitem yavasladı ben sitem yükleniken iframenin yüklenmesini istemiyorum yapabilir miyim ?
zaten bi tusa tıkalyınca asagı dogru acılıo sitem.yüklemesin ve tusa basınca yüklesin.

ah ah hayal

R

recipe

11 yıl

Er

Bu konudaki deneyimini bilmediğim için hiç bilmiyormuşssun gibi davranıp vereceğim cevabı. Umarım yanlış anlamazsın :)

Javascript veya javascript tabanlı bir kütüphane kullanman gerekiyor (örn: jQuery). Javascript kullanıcı tarafında (Browser) çalıştığı için istediğin zaman bir butona bir aksiyon verip istediğin kodu (html) sayfaya ekleyebilirsin.

örnek olarak bu sayfada (http://www.developerfusion.com/thread/33979/creating-iframe-through-javascript/) bir kod parçası var:

<html>  
  <head>  
  <script language="JavaScript" type="text/javascript">  
  function makeFrame() {  
     ifrm = document.createElement("IFRAME");  
     ifrm.setAttribute("src", "http://developerfusion.com/");  
     ifrm.style.width = 640+"px";  
     ifrm.style.height = 480+"px";  
     document.body.appendChild(ifrm);  
  }  
  </script>  
  </head>  
  <body>  
  <p><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95629665&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">GO! </a></p>  
  </body>  
  </html>

Bu mesaja 1 cevap geldi.

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

quote:

Orijinalden alıntı: recipe

Bu konudaki deneyimini bilmediğim için hiç bilmiyormuşssun gibi davranıp vereceğim cevabı. Umarım yanlış anlamazsın :)

Javascript veya javascript tabanlı bir kütüphane kullanman gerekiyor (örn: jQuery). Javascript kullanıcı tarafında (Browser) çalıştığı için istediğin zaman bir butona bir aksiyon verip istediğin kodu (html) sayfaya ekleyebilirsin.

örnek olarak bu sayfada (http://www.developerfusion.com/thread/33979/creating-iframe-through-javascript/) bir kod parçası var:
<html>  
  <head>  
  <script language="JavaScript" type="text/javascript">  
  function makeFrame() {  
     ifrm = document.createElement("IFRAME");  
     ifrm.setAttribute("src", "http://developerfusion.com/");  
     ifrm.style.width = 640+"px";  
     ifrm.style.height = 480+"px";  
     document.body.appendChild(ifrm);  
  }  
  </script>  
  </head>  
  <body>  
  <p><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95643295&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">GO! </a></p>  
  </body>  
  </html> 

abi öncelikle hayalime yardımın için teşekkür ederim.yazdıklarına katılıyorum evet hiç ama hiç bilmiyorum.evet bir kod verdin ama ben bu acıklama ile ible yapamam.

senden bi rıcam var duacımım.

anasayfamda iframemin açılması için kullandığım kod aşağıdadır.

şimdi ben bu iframemin sitem acılısta değil iframeyi aç buttonuna tıkladıgı zaman yüklenmesini istiyorum.lütfen yaparsım dimi

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
  	<button>iframeyi aç/yükle</button>  
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  	<iframe width="854" height="510" src="ifkodum" frameborder="0" allowfullscreen></iframe> 
  </div>

Bu mesaja 1 cevap geldi.

R

recipe

11 yıl

Er

Kodu ekleyince şöyle bir şey oluşuyor. Acele yazıyorum deneme şansım yok.

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
      ifrm = document.createElement("IFRAME");  
      ifrm.setAttribute("src", "http://developerfusion.com/");  
      ifrm.style.width = 854+"px";  
      ifrm.style.height = 510+"px";  
      document.getElementsByClassName('orta').appendChild(ifrm);  
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95673559&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

Bu mesaja 1 cevap geldi.

Bu mesajda bahsedilenler: @virtualdjcubase

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

quote:

Orijinalden alıntı: recipe

Kodu ekleyince şöyle bir şey oluşuyor. Acele yazıyorum deneme şansım yok.

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
      ifrm = document.createElement("IFRAME");  
      ifrm.setAttribute("src", "http://developerfusion.com/");  
      ifrm.style.width = 854+"px";  
      ifrm.style.height = 510+"px";  
      document.getElementsByClassName('orta').appendChild(ifrm);  
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95684523&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

abi çok saol zahmetin için ama hem asagı dogru acılması lazımdı slider olarak acılmıyor hemde malesef iframe koyunca hiç bişe gorunmuyor :(

eger bi kez daha benim için bakarsan çok sevinirim

Bu mesaja 1 cevap geldi.

R

recipe

11 yıl

Er

Bu çalışır dostum

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
              $('<iframe />');  // Create an iframe element 
              $('<iframe />', { 
                  name: 'frame1', 
                  id: 'frame1', 
                  src: 'http://forum.donanimhaber.com/' 
              }).appendTo(".orta"); 
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95687850&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

< Bu mesaj bu kişi tarafından değiştirildi recipe -- 7 Ağustos 2014; 18:13:00 >
Bu mesaja 1 cevap geldi.

Bu mesajda bahsedilenler: @virtualdjcubase

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

quote:

Orijinalden alıntı: recipe

Bu çalışır dostum

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
              $('<iframe />');  // Create an iframe element 
              $('<iframe />', { 
                  name: 'frame1', 
                  id: 'frame1', 
                  src: 'http://forum.donanimhaber.com/' 
              }).appendTo(".orta"); 
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95690209&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

abi 2 problem kaldı ya
1-linke tıkalyınca acıyo ama bidaha tıklayınca yanında bidaha acıyo :( oysa bi daha tıklayınca kaybolması lazımdı yukarı doru...
aslında sorun sliderde sanırım cunku tıklayınca asagı doru acılan slider bi daha tıklayınca yukarı doru kapanıodu.sldier sanırım suan calsımıor.

duacımnım abi inanki okadar önemliki anlatamam.gtmetrix anasayfamda ifrarameyi yüklediğini görmeyince 15 puan artıcak üstelik fiziksel olarakta cok yavaslıor iframe ile.

sanırım bu sekilde duzelicek.

bi şans daha lütfen

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

bu arada slider olmusa cokta lazım deil abi zınk die asaıg acılıpo zınk diye yukarıda kapanabilir yanii gerci bu da slider oluo dimi :)

Bu mesaja 1 cevap geldi.

R

recipe

11 yıl

Er

Bunu deneyebilirsin:

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
    if ($('#frame1').length) { 
      $('#frame1').toggle(); 
    } else { 
              $('<iframe />');  // Create an iframe element 
              $('<iframe />', { 
                  name: 'frame1', 
                  id: 'frame1', 
                  src: 'http://forum.donanimhaber.com/' 
              }).appendTo(".orta"); 
    } 
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95694960&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

Bu mesaja 1 cevap geldi.

Bu mesajda bahsedilenler: @virtualdjcubase

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

quote:

Orijinalden alıntı: recipe

Bunu deneyebilirsin:

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">  
  <head>  
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />  
  <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
   
  </head>  
  <body>  
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:10px;background:#ddd}  
  .kredikarti {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#FCFCFC;margin:0 auto;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  .clear {clear:both;}  
  p{font:12px tahoma; color:black;}  
  .clear {clear:both;}  
  h2 {font:bold 15px arial;color:blue;}  
   
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .paypal {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#DCF3FC;margin:0 auto;}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  </style>  
   
   
  <style type="text/css">  
  .soru {width:50%;margin:0 auto;border-radius:15px 15px 0 0;padding:20px;background:#ddd}  
  .ptt {display:none;width:21%;border-radius:0 0 15px 15px;padding:5px 20px 20px 20px;background:#F3ED53;margin:0 auto}  
  p{font:12px tahoma; color:black;}  
  ul li{list-style:none}  
  button{border:2px solid green;background:#ddd;font:bold 14px tahoma;margin-top:50px;cursor: pointer;}  
  button.gizle{border:1px solid blue;background:#ddd;font:bold 12px tahoma;}  
  .butan {margin:0 auto;width:230px;border}  
  h2 {font:bold 15px arial;color:blue;}  
  .clear {clear:both;}  
  div.orta{display: table; margin: 0 auto;} <!-- div ortalamak için ekledim --> 
  </style>  
   
   
   
   
  <script type="text/javascript">  
   
  $(function() {  
  $("button").click(function(){  
   
  $(".kredikarti").slideToggle(1000);  
  $(".paypal").slideToggle(1000);  
  $(".ptt").slideToggle(1000);  
   
  $('html, body').animate({ 
        scrollTop: $(".ptt").offset().top + $('window').height() 
      }, 2000); <!-- sayfayı aşağı kaydırmak için ekledim --> 
  });  
  });  
   
  function makeFrame() {  
    if ($('#frame1').length) { 
      $('#frame1').toggle(); 
    } else { 
              $('<iframe />');  // Create an iframe element 
              $('<iframe />', { 
                  name: 'frame1', 
                  id: 'frame1', 
                  src: 'http://forum.donanimhaber.com/' 
              }).appendTo(".orta"); 
    } 
   }  
  </script> <!-- 3 tane scripte gerek yok. nesnelerine id verdiğinde script tagı içinde $("#kredikarti") şeklinde işlem yaptırman daha doğru olur. Bir sürü ayrı script tagı kod kalabalığı olur.--> 
   
   
  <div class="butan">  
          <a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=95699098&url=#" onMouseDown="makeFrame()" data-href="#" onMouseDown="makeFrame()">iframeyi aç/yükle</a> 
  </div>  
   
  <br />  
   
  <div class="orta"><!-- Bu div css ile ortalanıyor --> 
  	<div class="kredikarti" style="float: left;">  
  buraya iframe kodumu koycam ve yukardaki iframeyi yükle/aç tıklanınca yüklensin istiyorum:) 
  çünkü bu kod anasayfamda bi köşede olcak anasayfamın bi parçası sadece yani 
  </div>

abi çok saol ya bişe dicem yine boyutu neden görmuyor

function makeFrame() {
if ($('#frame1').length) {
$('#frame1').toggle();
} else {
$('<iframe />'); // Create an iframe element
$('<iframe />', {
name: 'frame1',
id: 'frame1',
src: 'https://iframeadresim/embed_widget/s/7gu4itx91n1de7wvy62r?view=list&sort=name&direction=ASC&theme=blue" width="700" height="400'
}).appendTo(".orta");
}
}

ben sadece yukarıya iframeyi giriyorum src kısmına baska yere girmiyorum doru dimi.

ama böle olsada botutu gormuyor 700e 400 acılsın istiyodum sayfada hiç boyut ayarı bulamadım

Bu mesaja 1 cevap geldi.

V

virtualdjcubase

11 yıl

Yarbay

Konu Sahibi

naptımsa olmadı :(